[Selector] JQ - :only-child 가상선택자 - 그 부모의 타입 무관 유일 자식요소 모두 선택. (= 온리 차일드 선택자)

1. :only-child 예제 - 그 부모의 타입 무관 유일 자식p요소 선택.
2. :only-child 정의
3. :only-child 구문

:only-child 예제 - 그 부모의 타입 무관 유일 자식p요소 선택.

 

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

<script>

$(document).ready(function(){

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

});

</script>

<div style="border:1px solid;">

  <p>홈짱닷컴.</p>

  <p>Homzzang.com</p>

</div><br>

<div style="border:1px solid;">

  <p>홈페이지 제작관리</p>

</div><br>

<div style="border:1px solid;">

  <span>코딩언어</span>

  <p>그누보드</p>

</div>

 

결과보기

:only-child 정의

 

그 부모의 유일한 자식 요소 모두 선택.

※ 유일 자식 아니면 해당 X. (위 예제)

 

:only-child 구문

 

$(":only-child")