jquery 的:empty选择器

最新推荐文章于 2024-09-11 13:53:33 发布

eternity668

最新推荐文章于 2024-09-11 13:53:33 发布

阅读量1.7k

点赞数

分类专栏： jquery 文章标签： jquery翻译

jquery 专栏收录该内容

44 篇文章

订阅专栏

本文解释了jQuery中empty选择器的功能，强调了选择器在处理具有结束标签和无结束标签元素时的不同行为，并通过实例代码展示了如何使用该选择器。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在jquery中，empty 选择器用来选择不包含任何子元素(包括内部文本)的元素。

注意使用empty 选择时，其选择的标签元素应该以</elementName>来结尾，即要有结束标签，如果是<element/>的标签元素即没有结束标签，empty 选择器有可能选择不到这样的没有结束标签的元素。

例子：

<divclass="div-class1">

   This is div-class1

</div>

<divclass="div-class2" ></div>

$(“:empty”)—div-class2 匹配，而div-class1 不匹配。

实例代码：

<html>
<head>
<title>jQuery empty example</title>
 
<script type="text/javascript" src="../jquery-1.11.1.min.js"></script>
 
<style type="text/css">
	div{
		padding:8px;
		border:1px solid;
	}
</style>
</head>
 
<body>
 
<h1>jQuery empty example</h1>
 
<div class="div-class1">
	This is div-class1
</div>
 
<div class="div-class2"></div>
 
<div class="div-class3">
	This is div-class3
	<div class="div-class3-1">
		This is div-class3-1
	</div>	
</div>
 
<br/><br/>
 
<button>:empty</button>
 
<script type="text/javascript">
    $("button").click(function () {
      var str = $(this).text();
      $("*").css("background", "white");
      $(str).css("background", "coral");
     
    });
</script>
 
</body>
</html>

效果：