javascript - 要素に特定のテキストが含まれている場合

Question

$('.test').css('background','red');

<div id="example">Some text</div>

「テキスト」という単語が含まれている.addClass('test')場合はどうすればよいですか?#example

Answer 1

:contains疑似クラスを使用するだけです

$('#example:contains("text")').addClass('test');

#exampleこれにより、 「テキスト」が含まれている場合にクラスが追加されます

Answer 2

を使用$("#example")して要素の jQuery ラッパーを取得し、 を使用text()してそのテキストを取得し、 を使用できますString#indexOf。たとえば、次のようになります。

var ex = $("#example");
if (ex.text().indexOf("text") !== -1) {
    ex.addClass("test");
}

F. Calderan が示すよう:contains("text")にセレクターで使用することもできますが、そのような非標準の疑似セレクターを使用する場合、jQuery は要素を検索するために基礎となるブラウザーの組み込みのものを使用できないため、遅くなる可能性があることに注意してください。上記により、jQuery が を使用できるようになります。ただし、速度が本当に重要になる状況はごくわずかです。document.getElementById

Answer 3

次のコードを試してください

$('#example:contains("text")').addClass('test');

セレクターの例と説明については、こちらをご覧ください:contains