JQuery :contains(text) 선택기 사용 사례
- 黄舟원래의
- 2017-06-23 11:05:251774검색
Overview
주어진 텍스트를 포함하는 요소와 일치
매개변수
textStringV1.1.4
A 찾을 문자열
예
설명:
"John" div 요소를 포함하는 모든 요소 찾기
HTML 코드 : l
<div>John Resig</div> <div>George Martin</div> <div>Malcom John Sinclair</div> <div>J. Ohnjquery 코드 :
r
$("div:contains('John')")result : [ <div>John Resig</div>, <div>Malcom John Sinclair</div> ]
example 코드 : 예 :
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title>脚本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("li:contains('html')").css("color","blue")
})
})
</script>
</head>
<body>
<ul>
<li>html专区</li>
<li>div+css专区</li>
<li>Jquery专区</li>
<li>Javascript专区</li>
<li>html5专区</li>
</ul>
<button>点击查看效果</button>
</body>
</html>
위의 코드에는 "html"텍스트 색상이 포함될 수 있습니다. li 요소는 파란색으로 설정됩니다.
jQuery의 :contains(text)
<body>
<div>
我 </div><script>
$(function(){
$(':contains(你)').css('background','lime');
});</script> </body>:contains 선택기는 지정된 문자열을 포함하는 요소를 선택합니다. (W3school) 문자열 "you"가 포함된 요소를 선택하고 싶습니다. 당연히 페이지에 기준에 맞는 요소가 없지만 페이지도 녹색으로 변합니다. 다음 두 가지 방법으로 페이지를 녹색으로 만들 수도 있습니다(블라인드 테스트) $(':even').css('Background','lime') $(':odd').css('Background','lime ') ; 왜 그렇습니까? 감사해요. 1.:contains('you') 페이지 아트가 녹색으로 바뀌는 이유는 무엇인가요? 스크립트 태그가 html 화면에 있으므로 jquery는 요소를 검색할 때 전체 화면을 검색합니다. 그런 다음 스크립트에서 귀하가 작성한 JavaScript 코드인 'you'를 찾으십시오. 프로그램은 이를 당분간 텍스트로 처리합니다. $(function(){
$(':contains(你)').css('background','lime');
});So: 포함(you)은 html, body, As 등 세 가지 요소를 찾아야 합니다. 물론 이 스크립트의 세 가지 요소에 대한 스타일을 추가하려면 스크립트에서 지원하지 않으면 쓸모가 없습니다. 2.$(':even').css('Background','lime'); $(':odd').css('Background','lime'); 왜 화면이 녹색으로 바뀌나요? $(':even')은 html을 선택하고, $(':odd')는 본문을 선택하며, 이 두 요소의 배경을 설정하는 것은 물론 유용합니다. 또 다른 추가 사항: 첫 번째 사항에 대해 js 코드를 js 파일에 작성한 다음 스크립트 태그를 통해 도입하면 이러한 문제가 발생하지 않습니다. 찾고 있는 텍스트가 위 내용은 JQuery :contains(text) 선택기 사용 사례의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.