일반적으로 사용되는 jQuery selectors_jquery 요약

Dom 프로그래밍에서는 id 또는 TagName을 기반으로 Dom 객체를 얻기 위해 제한된 함수만 사용할 수 있습니다. 그러나 jQuery에서는 페이지에서 객체를 얻고 반환된 객체를 변환하는 데 도움이 되는 매우 강력한 선택기를 제공합니다. jQuery 래퍼 세트로. 본 글에서는 주로 일반적으로 사용되는 jQuery 선택자를 소개하고 분류한다.

jQuery 선택기는 크게 기본 선택기, 계층적 선택기, 필터 선택기, 양식 선택기의 4가지 범주로 나눌 수 있습니다.
필터 선택기는 단순 필터 선택기, 콘텐츠 필터 선택기, 가시성 필터 선택기, 속성 필터 선택기, 하위 요소 필터 선택기, 양식 개체 속성 필터 선택기로 나눌 수 있습니다.

기본 선택기:

$("#myELement") id 값이 myElement와 동일한 요소를 선택합니다. id 값은 반복될 수 없습니다. 문서에는 id 값 myElement가 하나만 있을 수 있으므로 유일한 요소를 가져옵니다.
$("div") 모든 div 태그 요소를 선택하고 div 요소의 배열을 반환합니다.
$(".myClass") myClass 클래스의 CSS를 사용하여 모든 요소 선택
$("*") 문서의 모든 요소 선택[/code]
공동 선택을 위해 다양한 선택 방법을 사용할 수 있습니다. 예: $("#myELement,div,.myclass")

계단식 선택기:

$("form input") 양식 요소의 모든 입력 요소 선택
$("#main > *") id 값이 main
인 모든 하위 요소를 선택합니다. $("label input") 모든 레이블 요소 중 다음 입력 요소 노드를 선택합니다
테스트된 선택기는 레이블 태그 바로 뒤에 입력 태그가 오는 모든 입력 태그 요소
를 반환합니다. $("#prev ~ div") 형제 선택기
이 선택기는 ID가 prev인 태그 요소의 동일한 상위 요소에 속하는 모든 div 태그

를 반환합니다.

기본 필터 선택기:

$("tr:first") 모든 tr 요소 중 첫 번째
를 선택합니다. $("tr:last") 모든 tr 요소 중 마지막
을 선택합니다. $("input:not(:checked) 범위")
필터링: 선택된 선택기의 모든 입력 요소
$ ("TR: EVEN") 모든 TR 요소 중 0, 2, 4 ... ... Personal 요소를 선택합니다. (참고: 선택한 여러 요소는 선택 시 배열이므로 일련 번호는 0부터 시작합니다.) $("td:eq(2)") 모든 td 요소 중 일련번호 2를 갖는 td 요소를 선택합니다
$("td:gt(4)") 시퀀스 번호가 4보다 큰 모든 td 요소를 선택합니다
$ ("TD: LL (4)") TD 항목에서 일련번호가 4 미만인 TD 항목을 모두 선택합니다
$(":헤더")
$("div:애니메이션")

콘텐츠 필터 선택기:

$("div:contains('John')") John 텍스트가 포함된 모든 div 요소 선택

$("td:empty") 비어 있는 모든 td 요소의 배열을 선택합니다(텍스트 노드 제외)
$("div:has(p)") p 태그가 포함된 모든 div 요소 선택
$("td:parent") td를 상위 노드로 사용하는 모든 요소 배열을 선택합니다

시각적 필터 선택기:

$("div:hidden") 숨겨진 div 요소 모두 선택

$("div:visible") 보이는 모든 div 요소 선택

속성 필터 선택기:

$("div[id]") id 속성을 포함하는 모든 div 요소 선택
$("input[name='newsletter']") 이름 속성이 'newsletter'와 동일한 모든 입력 요소를 선택합니다
$("input[name!='newsletter']") 이름 속성이 'newsletter'와 동일하지 않은 모든 입력 요소를 선택합니다
$("input[name^='news']") 이름 속성이 'news'로 시작하는 모든 입력 요소를 선택합니다
$("input[name$='news']") 이름 속성이 'news'로 끝나는 모든 입력 요소를 선택합니다
$("input[name*='man']") 이름 속성에 'news'가 포함된 모든 입력 요소를 선택하세요
$("input[id][name$='man']") 공동 선택을 위해 여러 속성을 사용할 수 있습니다. 이 선택기는 id 속성을 포함하는 모든 요소를 ​​가져오고 속성은 man

으로 끝납니다.

하위 요소 필터 선택기:

$("ul li:nth-child(2)"),$("ul li:nth-child(odd)"),$("ul li:nth-child(3n 1)")
$("divspan:first-child") 모든 div 요소의 첫 번째 하위 노드 배열을 반환합니다.
$("divspan:last-child") 모든 div 요소의 마지막 노드 배열을 반환합니다
$("div 버튼:only-child") 모든 div에 하위 노드가 하나만 있는 모든 하위 노드의 배열을 반환합니다

양식 요소 선택기:

$(":input") 입력, 텍스트 영역, 선택 및 버튼을 포함한 모든 양식 입력 요소를 선택합니다
$(":text") 모든 텍스트 입력 요소 선택
$(":password") 모든 비밀번호 입력 요소 선택
$(":radio") 모든 라디오 입력 요소 선택
$(":checkbox") 모든 체크박스 입력 요소 선택
$(":submit") 모든 제출 입력 요소 선택
$(":image") 모든 이미지 입력 ​​요소 선택
$(":reset") 모든 재설정 입력 요소 선택
$(":button") 모든 버튼 입력 요소 선택
$(":file") 모든 파일 입력 요소 선택
$(":hidden") 숨겨진 유형인 양식의 모든 입력 요소 또는 숨겨진 필드를 선택합니다

양식 요소 필터 선택기:

$(":enabled") 작동 가능한 모든 양식 요소 선택
$(":disabled") 작동할 수 없는 모든 양식 요소 선택
$(":checked") 체크된 양식 요소 모두 선택
$("select option:selected") 모든 선택된 하위 요소 중에서 선택된 요소를 선택합니다