jquery - jQuery：複数の文字列を検索するためのセレクターが含まれています

Question

私が持っていると仮定して：

<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()

ありがとう！

Answer 1

答え

メアリーとジョンliの両方を含むテキストを持つのを見つけるには：

$('li:contains("Mary"):contains("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

Answer 2

どうですか

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

Answer 3

答え

正しい構文は次のようになります$("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;
};

Answer 4

それは簡単です：

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