JQuery，选择器 - 子元素和包含表达式答案

【问题标题】：JQuery, Selectors - Child Elements and Contains ExpressionsJQuery，选择器 - 子元素和包含表达式
【发布时间】：2015-01-24 10:00:31
【问题描述】：

对于 Jquery 和选择器：是否可以在 contains 子选择器中搜索多个字符串以查找嵌套的子元素？

例如：

<div>
    <span>foo</span>
    <span>bar</span>
</div>

// comma is usual OR operator.
$("div > span:contains(['foo'],['bar'])").css("text-decoration","underline");

预期：两个元素都有下划线。

如果还没有实现，我们可以实现它吗？ ^-^

【问题讨论】：

文本装饰到文本装饰

标签： jquery selector contains

【解决方案1】：

是的，您可以使用以下方法同时搜索包含 div 或 span 或任何其他 HTML 元素的两个或多个搜索词

$('span:contains("foo"), span:contains("bar")').css("text-decoration", "underline") // either one OR two
$('span:contains("foo"):span:contains("bar")').css("text-decoration", "underline") //span, which contains both

【讨论】：

【解决方案2】：

你可以尝试使用 .filter() 之类的

$("div &gt; span").filter(":contains('foo'),:contains('bar')").css("text-decoration", "underline");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div>
  <span>foo</span>
  <span>bar</span>
</div>

【讨论】：

在查看了这两种解决方案之后，这可能是更合适的一种，因为它考虑了子元素。谢谢大家。 ^-^

【解决方案3】：

在语法中使用带有“-”的text-decartion。我想你错过了

$("div span").each(function() {

   if($(this).text() == "foo" || $(this).text() == "bar"){

     $(this).css("text-decoration", "underline");
   }
});

FIDDLE

【讨论】：