根据内容选择元素

【问题标题】：Select element based on the content within根据内容选择元素
【发布时间】：2014-11-17 22:49:33
【问题描述】：

假设我有这样的html：

<a href='#'>Apple</a>
<a href='#'>Orange</a>
<a href='#'>Apple</a>

如何只选择内容为Apple 的链接？

【问题讨论】：

select 是什么意思？
jQuery select based on text的可能重复
好吧，糟糕的表现，但你可以这样做：jQuery( ":contains(text)" )
@PeterKA - 相关，但我不认为这是重复的。

标签： jquery jquery-selectors

【解决方案1】：

您可以使用:contains()

$("a:contains('Apple')").addClass("apple");

.apple {
  background: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href='#'>Apple</a>
<a href='#'>Orange</a>
<a href='#'>Apple</a>

【讨论】：

【解决方案2】：

使用Jquery的过滤方法http://api.jquery.com/filter/

var Apples = $('a').filter(function () {
  return $.trim($(this).text()) == 'Apple';
});

【讨论】：

【解决方案3】：

使用 :contains jquery 选择器选择内容：

HTML：

<a href='#'>Apple</a>
<a href='#'>Orange</a>
<a href='#'>Apple</a>

查询：

$('a:contains("Apple")').css("color","red");

如果您之前没有包含 Jquery 库，请不要忘记包含它：

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

JSFIDDLE：http://jsfiddle.net/ghorg12110/p1x3n43s/

【讨论】：