Web/Javascript
jQuery - contains() - 특정 문자열 요소 모두 선택하기
luvris2
2023. 4. 28. 16:35
반응형
contains()
- 지정한 텍스트를 포함하는 모든 요소 선택
구문
jQuery(":contains( text )")- text : 찾을 텍스트 문자열, 대소문자 구분
- 괄호 안의 문자열은 간단한 단어로 쓰거나 따옴표로 묶을 수 있음
사용 예시
- 특정 문자열 'eunbyeol' 이 포함된 모든 div를 찾아 글씨색을 빨간색으로 변경하고 밑 줄 긋기
<!DOCTYPE html>
<html lang="ko">
<head>
<!-- jQuery 라이브러리 호출 -->
<script src="https://code.jquery.com/jquery-3.6.3.min.js"></script>
</head>
<body>
<!-- Div 요소 선언 -->
<div>tester</div>
<div>admin</div>
<div>eunbyeol</div>
<div>soohyun</div>
<script>
// $("div:contains('')") : div 요소 안의 문자열 검색
// .css( 속성, 값 ) : 선택한 요소의 css 스타일 한 개 적용
// .css( { 속성:값, 속성:값 } ) : 선택한 요소의 css 스타일 여러개 적용
$( "div:contains('eunbyeol')" )
.css( {"text-decoration" : "underline", "color" : "red"} );
</script>
</body>
</html>
- 실행 화면
참고
반응형