has 선택자
선택자 :has는 지정된 선택자에 해당하는 요소를
적어도 하나 포함하는 요소를 선택하며,
반드시 직계 자손일 필요는 없습니다.
:has는 CSS 사양에 속하지 않기 때문에,
현대 브라우저에서 성능을 향상시키기 위해서는
$("your css-selector").has(selector/DOM element)를
대신 사용하는 것이 좋습니다.
구문
이렇게 하여 요소를 선택합니다:
$(':has(selector)');
선택자의 직접적인 중첩이 필요한 경우, 이렇게 하여 요소를 선택합니다:
$(':has(>selector)');
예시
내부에 b 태그가 있는
단락만 선택하고 그 끝에 텍스트 '!!!'를 넣어봅시다:
<p>text</p>
<p>text</p>
<p><b>bold</b> text</p>
<p><b>bold</b> text</p>
$('p:has(b)').append('!!!');
HTML 코드는 이렇게 보이게 됩니다:
<p>text</p>
<p>text</p>
<p><b>bold</b> text!!!</p>
<p><b>bold</b> text!!!</p>
