[Selector] JQ - :visible 선택자 - 눈에 보이는 요소 선택. (= 비지블 선택자)

1. :visible 예제 - 눈에 보이는 p요소 선택.
2. :visible 정의
3. :visible 구문

:visible 예제 - 눈에 보이는 p요소 선택.

 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script>

$(document).ready(function(){

  $("p:visible").css("background-color", "yellow");

});

</script>

<p>홈짱닷컴</p>

<p>Homzzang.com</p>

<p style="display:none">홈페이지 제작관리</p>

결과보기

:visible 정의

 

눈에 보이는 요소 선택.

 

---

 

1. 눈에 보이는 요소는 아래 요소가 아닌 요소를 말함. 

① display:none 설정된 요소.

② type="hidden" 갖는 Form 요소.

③ width, height 값이 0인 요소.

④ 숨어있는 부모 요소. (※ 이는 자식 요소들도 숨김.) 

 

2. cf.

:hidden 선택자 - 눈에 안 보이는 요소 선택.

 

:visible 구문

 

$(":visible")