셀렉터 사용하기 #3 - jQuery 정의 셀렉터

CSS셀렉터로는 표현할 수 없는 특성있는 엘리먼트를 선택할 필요가 있다.

:radio:checked

:checkbox:checked

 

* jQuery 정의 필터 셀렉터

 

셀렉터	설명
:animated	현재 애니메이션이 적용되고 있는 엘리먼트를 선택
:button	모든 버튼을 선택  input[type=submit], input[type=reset], input[type=button], button
:checkbox	체크박스 엘리먼트만 선택.  input[type=checkbox]
:checked	선택된 체크박스나 라디오 버튼만을 선택.
:contains(foo)	텍스트 foo를 포함하는 엘리먼트만 선택
:disabled	인터페이스에서 비활성화 상태인 모든 폼 엘리먼트를 선택
:enabled	인터페이스에서 활성화 상태인 모든 폼 엘리먼트를 선택
:file	모든 파일 엘리먼트를 선택.  input[type=file]
:header	헤더 엘리먼트만 선택.  <h1>~<h6>
:hidden	감춰진 엘리먼트만 선택
:image	폼 이미지를 선택.  input[type=image]
:input	입력 엘리먼트만 선택.  input, select, textarea, button
:not(filter)	필터의 값을 반대로 변경
:parent	빈 엘리먼트를 제외하고, 텍스트도 포함해서 자식 엘리먼트를 가지는 엘리먼트를 선택
:password	패스워드 엘리먼트만 선택.  input[type=password]
:radio	라디오 버튼 엘리먼트만 선택.  input[type=radio]
:reset	리셋 버튼을 선택.  input[type=reset]이나 button[type=reset]
:selected	선택된 엘리먼트만 선택
:submit	전송 버튼을 선택.  button[type=submit]이나 input[type=submit]
:text	텍스트 엘리먼트만 선택.  input[type=text]
:visible	보이는(visible) 엘리먼트만 선택

 

 

input:not(:checkbox)

필터 셀렉터는 기준을 추가해서 일치하는 엘리먼트의 집합을 줄여나간다.

찾기 셀렉터는 이미 선택된 엘리먼트와 맺은 관계를 통해 다른 엘리먼트를 찾는다.

= 자손 셀렉터(공백문자), 자식 셀렉터(>), 형제 셀렉터(+)

 

:not은 필터 셀렉터에는 적용

찾기 셀렉터에는 적용하지 못한다.

div p:not(:hidden) : O

div :not(p:hidden) : X

 

필터 셀렉터는 콜론문자(:)나 대괄호문자([)로 시작하는 형식으로 만들어 식별한다.