IT스러운 공간

[jQuery] 내용, Visibility 필터 선택자 : Content, Visibility filters 본문

기타/jQuery

[jQuery] 내용, Visibility 필터 선택자 : Content, Visibility filters

nanaing 2024. 1. 26. 00:06
728x90

1. :contains(string)

: 특정 문자열을 포함하고 있는 요소를 선택한다.

: string은 곧바로 문자열을 포함할 수도 있고, child element안에 포함할 수 도 있다.

: 그룹 안에서 특정 텍스트를 포함하는 요소를 선택하고자 하는 다른 요소들과 흔히 같이 사용됨

: String은 대소문자 구별함

: 문법 - $(":contains(text)")

: 예) $("p:contains(is)")

 

2. :empty()

: empty element를 선택한다.

: child elements 또는 text가 없는 element를 의미한다.

: 문법 - $(":empty")

: 예) $(":empty")

: 스페이스 공백이 있을 경우에는 text가 있는 경우로 의미한다.

 

3. :has()

: 지정된 셀렉터에 일치하는 내부의 하나 이상의 요소를 모든 element를 선택한다.

: 내부에 여러 element를 선택하려면 쉼표를 사용

: 문법 - $(":has(selector)")

: 예) $("p:has(span)")

 

4. :parent()

: 텍스트를 포함하고 있는 element의 parent element를 선택한다. :empty()와 반대의미

: 문법 - $(":parent")

: 예제) $("td:parent") - td 태그의 비어있지 않은 것을 선택한다.

 

5. :hidden

: hidden element를 선택한다.

: hidden element

1) display:none으로 설정

2) Form 태그의 type 속성이 hidden으로 된 것 ex) <input type="hidden"></>

3) 너비와 높이가 0으로 설정

4) parent element의 속성이 hidden인 것

: 문법 - $(":hidden")

: 예) $(":hidden").show(1000); - 숨겨진 것들을 시간동안 보여줌 숫자가 크면 느려지고 작으면 빨라짐

 

6. :visible

: 현재 보이는 모든 element를 선택한다.

: hidden element와 정반대의 개념. hidden element가 아닌 모든 것을 의미힌다.

: 문법 - $(":visible")

: 예제) $("p:visible")

728x90