특정 문자열을 포함한 요소를 선택하는 선택자 - :contains()

:contains()

:contains()는 특정 문자열을 포함한 요소를 선택하는 선택자입니다.

 

기본형

$( ':contains(text)' )

문자열 포함 여부를 따질 때 대소문자를 구분한다는 점에 주의합니다.

예를 들어

$( 'p:contains("abc")' )

abc 문자열을 포함한 <p> 요소를 선택합니다.

 

예제

• abc를 포함한 <p> 요소를 선택해서 글자를 빨간색으로 만듭니다.
• 첫번째 문단은 abc가 없어서 선택되지 않습니다.
• 세번째 문단은 abc가 있지만 대문자여서 선택되지 않습니다.

<p>Lorem ipsum dolor sit amet.</p>
<p>Aenean nec mollis abc nulla.</p>
<p>Phasellus ABC lacinia tempus mauris eu laoreet.</p>
<p>Proin gravida velit dictum abcdui consequat.</p>

$( document ).ready( function() {
  $( 'p:contains("abc")' ).css( 'color', 'red' );
});