JQuery 内容过滤选择器

最新推荐文章于 2024-01-13 22:21:09 发布

凌冰_

最新推荐文章于 2024-01-13 22:21:09 发布

阅读量327

点赞数

分类专栏： JQuery

本文链接：https://blog.csdn.net/hlx20080808/article/details/52767587

版权

JQuery 专栏收录该内容

35 篇文章 1 订阅

订阅专栏

HTML页面结构:

<body>
<a id="a1">contains(text)</a>  
<a id="a2">empty</a> 
<a id="a3">has(selector)</a> 
<a id="a4">parent</a> 
<hr/>
<h2>内容过滤选择器
</h2>
<div>Test Resign</div>
<div>JIMD Martin</div>
<div>Malcom Test Sinclair</div>
<div>M.Ohn</div>
<div></div>
<p></p>
<div><p>Has p</p></div>
</body>

:contains(text) 选取含有文本内容为"text"的元素

$("#a1").click(function(){
		//查找所有包含 "Test" 的 div 元素
		$("div:contains('Test')").css("background","cyan");
		  
	   });

:empty 选取不含任何子元素或文本的空元素

	    $("#a2").click(function(){
		
		$("div:empty").css("background","cyan");
		  
	   });

通过FireFox的Firebug可以查看: 此时的<div></div>标签已加入了样式!

:has(selector)选取含有选择器所匹配的元素的元素

 $("#a3").click(function(){
		
		$("div:has(p)").css("background","cyan");
		  
	   });

:parent选取含有子元素或者文本的元素标签

  $("#a4").click(function(){
		
		$("div:parent").css("background","cyan");
		  
	   });

凌冰_

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JQuery 内容过滤选择器

HTML页面结构:contains(text) empty has(selector) parent 内容过滤选择器Test ResignJIMD MartinMalcom Test SinclairM.OhnHas p:contains(text) 选取含有文本内容为"text"的元素$("#a1").click(function(){ //查
复制链接

扫一扫