JQuery: 包含用于搜索多个字符串的选择器

假设我有:

<li id="1">Mary</li>
<li id="2">John, Mary, Dave</li>
<li id="3">John, Dave, Mary</li>
<li id="4">John</li>

如果我需要找到包含“ John”和“ Mary”的所有 < li > 元素，我该如何构造 jQuery？

搜索单个字符串似乎很容易:

$('li:contains("John")').text()

我正在寻找像下面这样的伪代码:

$('li:contains("John")' && 'li:contains("Mary")').text()

谢谢！

65124 次浏览
小开

怎么样

$('li:contains("John"),li:contains("Mary")')
小开
最佳答案

回答我

要查找同时包含 Mary 还有 John 的 li:

$('li:contains("Mary"):contains("John")')

要查找包含含有 Mary 或者 John 的文本的 li:

$('li:contains("Mary"), li:contains("John")')

解释

只要把 :contains想象成一个类声明，就像 .class:

$('li.one.two').      // Find <li>'s with classes of BOTH one AND two
$('li.one, li.two').  // Find <li>'s with a class of EITHER one OR two

:contains也是如此:

$('li:contains("Mary"):contains("John")').      // Both Mary AND John
$('li:contains("Mary"), li:contains("John")').  // Either Mary OR John

演示

Http://jsbin.com/ejuzi/edit

小开

回答我

正确的语法应该是 $("li:contains('John'),li:contains('Mary')").css("color","red")

但是我发现如果你有很多需要测试的案例，jQuery 的表现将会非常糟糕(特别是在 IE6上，我知道，它已经很老了，但是仍然在使用中)。因此，我决定编写自己的属性过滤器。

这是如何使用它: $("li:mcontains('John','Mary')").css("color","red")

密码

jQuery.expr[':'].mcontains = function(obj, index, meta, stack){
result = false;
theList = meta[3].split("','");


var contents = (obj.textContent || obj.innerText || jQuery(obj).text() || '')


for (x=0;x<theList.length;x++) {
if (contents.indexOf(theList[x]) >= 0) {
return true;
}
}


return false;
};
小开

很简单:

$("li:contains('John'):contains('Mary')")

提交答案