jquery :has()和:contains()選擇器兩者之間的差異

jQuery:has()和jQuery:contains()兩個方法比較類似。不同點在於：

has是判斷標籤的

contains是判斷文字的

1、jQuery:has()

<div><p>Hello</p></div>
<div>Hello again!</div>
$("div:has(p)").addClass("test");
//含有p标签的div标签增加test样式

註：has中的括號裡可以含引號也可以省略。

2、jQuery:contains()

<div>John Resig</div>
<div>George Martin</div>
<div>Malcom John Sinclair</div>
<div>J. Ohn</div>
$("div:contains(&#39;John&#39;)").addClass(&#39;test&#39;);
//给含有John文本的div标签增加test样式

註：contains中的括號裡可以含引號也可以省略。

3、jQuery:empty

<div></div>
<div><span></span></div>
<div>span</div>
$(&#39;div:empty&#39;).addClass(&#39;test&#39;);
//给不含任何文本并且不含任何标签的div增加样式test

根據不同的內容和屬性可以準確定位到需要找的屬性

如何根據內容篩選標籤？
:contains        配對包含給定的文字元素

$("div:contains('Jhon')")

:has         符合含有選擇器所符合的元素的元素

#

$("div:has(p)").addClass("test")       p为标签

以上是jquery :has()和:contains()選擇器兩者之間的差異的詳細內容。更多資訊請關注PHP中文網其他相關文章！