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

 

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

 

 

+ Recent posts