コンテンツの完全一致によって要素を選択します

:contains()さて、jQueryのセレクターに、入力された文字列のみを含む要素を選択する方法があるかどうか疑問に思います

例えば ​​-

<p>hello</p>
<p>hello world</p>

$('p:contains("hello")').css('font-weight', 'bold');

セレクターは両方のp要素を選択して太字にしますが、最初の要素のみを選択するようにします。

いいえ、それを行うjQuery（またはCSS）セレクターはありません。

あなたはすぐに使うことができますfilter：

$("p").filter(function() {
    return $(this).text() === "hello";
}).css("font-weight", "bold");

これはセレクタではありませんが、機能します。:-)

「hello」の前または後に空白を処理したい場合は$.trim、そこにa をスローします。

return $.trim($(this).text()) === "hello";

そこに時期尚早オプティマイザのために、あなたはそれが一致していないことを気にしない場合<p><span>hello</span></p>と同様に、あなたがへの呼び出しを回避することができます$し、text使用してinnerHTML直接に：

return this.innerHTML === "hello";

...しかし、問題になるには多くの段落が必要になるため、最初に他の問題が発生する可能性があります。:-)

拡張疑似関数を追加してみてください：

$.expr[':'].textEquals = $.expr.createPseudo(function(arg) {
    return function( elem ) {
        return $(elem).text().match("^" + arg + "$");
    };
});

その後、次のことができます。

$('p:textEquals("Hello World")');

これを実現するには、jQueryのfilter（）関数を使用できます。

$("p").filter(function() {
// Matches exact string   
return $(this).text() === "Hello World";
}).css("font-weight", "bold");

したがって、アマンドゥの答えはほとんど機能します。しかし、実際にそれを使用していると、私はいくつかの問題に遭遇しました。これは、要素のテキストの周囲にランダムな空白が時々あるためです。「Hello World」を検索している場合でも、「Hello World」または「Hello World \ n」に一致させることをお勧めします。したがって、関数に「trim（）」メソッドを追加するだけで、周囲の空白が削除され、機能が向上し始めました。

具体的には...

$.expr[':'].textEquals = function(el, i, m) {
    var searchText = m[3];
    var match = $(el).text().trim().match("^" + searchText + "$")
    return match && match.length > 0;
}

また、この回答はテキストによるリンクの選択（完全一致）と非常に似てい ます。

二次メモ... 検索されたテキストの前後のtrim空白のみを削除します。単語の途中にある空白は削除されません。これは望ましい動作ですが、必要に応じて変更できます。

私は自分に合った方法を見つけました。100％正確ではありませんが、個々のスペースを含まない文字列もチェックするため、探している単語だけではない文字列をすべて削除します。ちなみに、これらは必要ありません ""。jQueryは、文字列を探していることを認識しています。：contains（）の部分にスペースが1つしかないことを確認してください。そうしないと機能しません。

<p>hello</p>
<p>hello world</p>
$('p:contains(hello):not(:contains( ))').css('font-weight', 'bold');

そして、はい、私はあなたが次のようなものを持っている場合は機能しないことを知っています <p>helloworld</p>

上記のTJ Crowderのように、フィルター機能は不思議です。私の場合、それは私にはうまくいきませんでした。複数のテーブルとそれぞれのtdタグをdiv（この場合はjQueryダイアログ）内で検索​​する必要がありました。

$("#MyJqueryDialog table tr td").filter(function () {
    // The following implies that there is some text inside the td tag.
    if ($.trim($(this).text()) == "Hello World!") {
       // Perform specific task.
    }
});

これが誰かに役立つことを願っています！

jQueryの代替ライブラリと連携するワンライナー：

$('p').filter((i, p) => $(p).text().trim() === "hello").css('font-weight', 'bold');

そして、これはjQueryのa:contains("pattern")セレクターと同等です。

var res = $('a').filter((i, a) => $(a).text().match(/pattern/));

.first（）はここで役立ちます

$('p:contains("hello")').first().css('font-weight', 'bold');