천천히 알아가는 세상

안녕하세요. 이번에는 JQuery의 기능 중 요소 추가 및 삭제를 할 수 있는 함수에 대하여 알아보겠습니다. 1. 추가 append 선택된 요소의 자식 요소 중 마지막으로 추가 • $( 선택자 ).append( 요소 ); prepend $( 선택자 ).prepend( 요소 ); • 선택된 요소의 자식 요소 중 첫 번째로 추가 before $( 선택자 ).before( 요소 ); • 선택된 요소의 형제 요소로 이전 형제로 추가 after $( 선택자 ).after( 요소 ); • 선택된 요소의 형제 요소로 다음 형제로 추가 기준 li를 기준으로 함수에 따라 해당 위치에 생성이 되는 것을 볼 수 있는 코드입니다. 기준 li append prepend beofre after 2. 삭제 remove $( 선택자..

안녕하세요. 이번에는 JavaScript 라이브러리 중 JQuery에 대해서 알아보겠습니다. JQuery JQuery는 HTML의 클라이언트 사이드 조작을 단순화하도록 설계된 크로스 플랫폼의 자바스크립트 라이브러리다. 장점 주요 웹 브라우저의 구버전을 포함한 대부분의 브라우저에서 지원 가능 HTML DOM를 손쉽게 조작 가능하며, CSS 스타일도 간단히 적용 가능 애니메이션 효과나 대화형 처리를 간단하게 적용 같은 동작을 하더라도 더욱 짧게 구현 가능 오픈 라이선스를 적용해 누구나 자유롭게 이용 가능 사용 방법 파일 다운로드 CDN 사용 여기서는 CDN 사용 방식으로 진행합니다. CDN 링크 바로가기 jQuery CDN The integrity and crossorigin attributes are us..

안녕하세요 이번에는 Bootstrap에 대해서 알아보겠습니다. 부트스트랩 (Bootstrap) 부트스트랩은 웹사이트를 쉽게 만들 수 있게 도와주는 CSS, JS 프레임워크입니다. 하나의 코드로 휴대폰, 태블릿, 데스크탑까지 다양한 기기에서 작동하게 만들 수 있으며, 다양한 기능을 제공하여 사용자가 쉽게 웹사이트를 제작, 유지, 보수할 수 있도록 도와줍니다. 공식 사이트 링크 사용 방법 대부분 부트스트랩을 사용할 때는 CDN 링크를 불러와서 사용합니다. 여기서는 CDN 링크를 불러오는 방법으로 진행합니다. 구글에 bootstrap라고 입력 후 Getting started로 접속합니다. 사이트로 접속하면 Guide에 대한 문서를 볼 수 있습니다. 여러 내용 중에서 2번 항목을 찾습니다. CDN links 관..

보호되어 있는 글입니다.

안녕하세요. 이번에는 DOM 객체와, 선택자에 대하여 알아보겠습니다. 1. DOM(Document Object Model) 객체 문서 객체 모델(DOM, Document Object Model)은 XML이나 HTML 문서에 접근하기 위한 일종의 인터페이스입니다. 이 객체 모델은 문서 내의 모든 요소를 정의하고, 각각의 요소에 접근하는 방법을 제공합니다. 이러한 DOM은 W3C의 표준 객체 모델이며, 다음과 같이 계층 구조로 표현됩니다. 2. Document 웹 페이지에 존재하는 HTML 요소에 접근하여 행동을 하고자 할 때 사용하는 객체 2-1. 속성 document.documentElement document.head document.title document.body document.URL docum..