jQuery Selector

jQuery Selector는 jQuery 라이브러리에서 HTML DOM 요소를 선택하고 조작하는 데 사용되는 표현식입니다.

jQuery Selector는 CSS 선택자와 매우 유사하며, CSS 선택자와 동일한 문법을 사용하여 HTML 요소를 선택하며, jQuery는 선택한 요소를 JavaScript 객체로 반환합니다.

jQuery Selector의 기본 문법은 "$()" 또는 "jQuery()" 함수를 사용하여 시작합니다. 

이 함수에 선택자를 전달하여 선택한 요소를 반환합니다.예를 들어, HTML 문서에서 모든 <p> 요소를 선택하려면 다음과 같은 코드를 사용할 수 있습니다.

 

$("p")

 

이 코드는 모든 <p> 요소를 선택하고 jQuery 객체로 반환합니다. 이제 반환된 객체에 대해 jQuery 함수를 호출하여 요소를 조작하거나 이벤트 핸들러를 연결할 수 있습니다.

 

jQuery Selector는 다양한 방법으로 요소를 선택할 수 있습니다. 몇 가지 예시를 들면:

 

요소 유형에 따라 선택하기

$("p") // 모든 <p> 요소 선택
$("div") // 모든 <div> 요소 선택

 

클래스 또는 ID를 기반으로 선택하기

$(".my-class") // class가 "my-class"인 모든 요소 선택
$("#my-id") // id가 "my-id"인 요소 선택

 

속성을 기반으로 선택하기

$("[href]") // href 속성을 가진 모든 요소 선택
$("[type='text']") // type 속성이 "text"인 모든 요소 선택

 

계층 구조에 따라 선택하기

$("ul li") // <ul> 요소 아래의 모든 <li> 요소 선택
$("parent > child") // parent 요소의 직계 자식인 child 요소 선택

 

필터를 사용하여 선택하기

$("p:first") // 첫 번째 <p> 요소 선택
$("p:last") // 마지막 <p> 요소 선택
$("p:even") // 인덱스가 짝수인 <p> 요소 선택

 

jQuery Selector는 이외에도 다양한 기능을 제공합니다.

선택한 요소를 조작하거나 이벤트 핸들러를 연결하는 등의 작업을 수행할 수 있습니다.