위코딩
반응형
article thumbnail
[jQuery] jQuery 선택자와 DOM 조작
Library/jQuery 2023. 7. 20. 14:31

jQuery는 CSS 선택자를 활용하여 DOM(Document Object Model) 요소를 선택하고, 선택한 요소를 다루는데 매우 편리한 메서드들을 제공합니다. 이를 통해 웹 개발자들은 더 쉽게 원하는 요소를 선택하고 조작할 수 있습니다. jQuery 선택자 jQuery는 $() 함수를 사용하여 CSS 선택자를 전달하여 DOM 요소를 선택합니다. 이를 통해 다양한 방법으로 요소를 선택할 수 있습니다. 요소 선택자 특정 태그의 모든 요소를 선택합니다. let allParagraphs = $('p'); // 모든 요소를 선택 클래스 선택자 특정 클래스를 가진 요소들을 선택합니다. let highlightedItems = $('.highlight'); // class="highlight"를 가진 요소들을 ..

article thumbnail
[jQuery] jQuery 소개와 기본 구문
Library/jQuery 2023. 7. 20. 14:26

jQuery는 자바스크립트 기반의 빠르고 간편한 웹 프론트엔드 개발을 위한 라이브러리입니다. 이는 HTML 문서 탐색, DOM 조작, 이벤트 핸들링, 애니메이션 효과 등을 단순화하고, 다양한 브라우저에서 일관된 동작을 지원하며, 간결한 문법으로 개발자들이 편리하게 사용할 수 있도록 제작되었습니다. jQuery 소개 jQuery는 2006년 존 레식이 개발한 오픈소스 자바스크립트 라이브러리로, 당시의 브라우저들이 서로 다른 방식으로 자바스크립트를 해석하는 문제를 해결하고자 탄생했습니다. 브라우저 호환성을 위한 크로스 브라우징 문제와 불편한 DOM 조작을 간소화하는 목적으로 제작된 jQuery는 웹 개발자들에게 큰 인기를 끌어왔으며, 현재까지도 다양한 웹 프로젝트에서 사용되고 있습니다. jQuery의 기본 ..

article thumbnail
[JS] DOM(Document Object Model) 조작
Language/JavaScript 2023. 7. 20. 14:06

DOM(Document Object Model)은 웹 페이지의 내용을 트리 형태로 표현하는 문서 객체 모델로, HTML, XML 또는 XHTML 문서의 구조와 콘텐츠에 접근하고 조작하는 기능을 제공합니다. 웹 브라우저는 HTML 문서를 로드하면서 DOM을 생성하고, 이를 통해 웹 페이지의 내용과 구조에 동적으로 접근하고 변경할 수 있습니다. DOM을 조작하여 웹 페이지를 동적으로 제어하는 방법에 대해 알아보겠습니다. DOM 요소 선택하기 DOM 요소를 선택하는 것은 해당 요소에 접근하여 조작하는 기본 단계입니다. 다양한 선택자를 사용하여 요소를 선택할 수 있습니다. ID 선택자 This is a div element. let myDiv = document.getElementById('myDiv'); 클래..

반응형
loading loading