Pilih elemen berdasarkan kecocokan yang tepat dari isinya

Baiklah, saya bertanya-tanya apakah ada cara untuk membuat :contains()pemilih jQuery untuk memilih elemen dengan hanya string yang diketikkan

sebagai contoh -

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

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

Pemilih akan memilih kedua pelemen dan membuatnya tebal, tapi saya ingin hanya memilih yang pertama.

Tidak, tidak ada pemilih jQuery (atau CSS) yang melakukan itu.

Anda dapat dengan mudah menggunakan filter:

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

Ini bukan pemilih , tapi itu berfungsi. :-)

Jika Anda ingin menangani spasi putih sebelum atau setelah "halo", Anda dapat melemparkan $.trimdi sana:

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

Untuk pengoptimal prematur di luar sana, jika Anda tidak peduli itu tidak cocok <p><span>hello</span></p>dan serupa, Anda dapat menghindari panggilan ke $dan textdengan menggunakan innerHTMLlangsung:

return this.innerHTML === "hello";

... tetapi Anda harus memiliki banyak paragraf agar itu penting, begitu banyak sehingga Anda mungkin memiliki masalah lain terlebih dahulu. :-)

Coba tambahkan fungsi extended pseudo:

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

Maka Anda dapat melakukan:

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

Anda dapat menggunakan fungsi filter () jQuery untuk mencapai ini.

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

Jadi jawaban Amandu kebanyakan berhasil. Namun, menggunakannya di alam liar, saya mengalami beberapa masalah, di mana hal-hal yang saya harapkan tidak ditemukan. Ini karena kadang-kadang ada ruang putih acak di sekitar teks elemen. Adalah keyakinan saya bahwa jika Anda mencari "Hello World", Anda masih ingin itu cocok dengan "Hello World", atau bahkan "Hello World \ n". Jadi, saya baru saja menambahkan metode "trim ()" ke fungsi, yang menghilangkan spasi putih, dan mulai bekerja lebih baik.

Secara khusus...

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

Perhatikan juga, jawaban ini sangat mirip dengan Pilih tautan menurut teks (kecocokan persis)

Dan catatan sekunder ... trimhanya menghilangkan spasi putih sebelum dan sesudah teks yang dicari. Itu tidak menghapus spasi di tengah kata-kata. Saya percaya ini adalah perilaku yang diinginkan, tetapi Anda bisa mengubahnya jika Anda mau.

Saya menemukan cara yang bekerja untuk saya. Ini tidak 100% tepat tetapi menghilangkan semua string yang mengandung lebih dari sekedar kata yang saya cari karena saya memeriksa string yang tidak mengandung spasi individual juga. Ngomong-ngomong kamu tidak butuh ini "". jQuery tahu Anda sedang mencari string. Pastikan Anda hanya memiliki satu ruang di bagian: berisi () jika tidak, tidak akan berfungsi.

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

Dan ya saya tahu itu tidak akan berhasil jika Anda memiliki barang seperti <p>helloworld</p>

Seperti TJ Crowder yang disebutkan di atas, fungsi filter memang menakjubkan. Itu tidak bekerja untuk saya dalam kasus khusus saya. Saya perlu mencari beberapa tabel dan masing-masing tag td di dalam div (dalam hal ini dialog 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.
    }
});

Saya harap ini membantu seseorang!

Satu baris yang berfungsi dengan pustaka alternatif untuk jQuery:

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

Dan ini setara dengan a:contains("pattern")pemilih jQuery :

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

.First () akan membantu di sini

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