jQuery內(nèi)容過濾選擇器
內(nèi)容過濾選擇器
:contains(內(nèi)容)
包含內(nèi)容選擇器，獲得節(jié)點內(nèi)部必須通過標簽包含指定的內(nèi)容
$(“div:contains(beijing)”)
<div>linken love beijing</div>
<div>jack love shanghai</div>
:empty
獲得空元素(內(nèi)部沒有任何元素/文本(空) )節(jié)點對象
$(“div:empty”)
<div>linken love beijing</div>
<div>jack love shanghai</div>
<div></div>
<div><img /></div>
<div> ?????</div>
?:has(選擇器)
內(nèi)部包含指定元素的選擇器
$(“div:has(#apple)”)
<div>hello</div>
<div><p></p></div>
<div><span id=”apple”></span></div>
<div><span class=”apple”></span></div>
:parent
尋找的節(jié)點必須作為父元素節(jié)點存在
$(“div:parent”)
<div>linken love beijing</div>
<div>jack love shanghai</div>
<div></div>
<div><img /></div>
<div> ?????</div>
<!DOCTYPE html>
<html>
<head>
<title>php.cn</title>
<meta charset="utf-8" />
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script>
function f1(){
//① $(":contains(text)")
$("div:contains(beijing)").css('background-color','red');
//② $(":empty")
$("div:empty").css('width','200px');
$("div:empty").css('height','100px');
$("div:empty").css('background-color','pink');
//③ $(":has(selector)")
console.log($("div:has(.orange)"));
//④ $(":parent")
console.log($("div:parent"));
}
</script>
</head>
<body>
<h1>內(nèi)容過濾選擇器</h1>
<div>i love beijing</div>
<div>jack love shanghai</div>
<div></div>
<div><img /></div>
<div> </div>
<div><p class="orange"></p></div>
<div><span class="orange"></span></div>
<input type="button" value="觸發(fā)" onclick="f1()" />
</body>
</html> 
