jquery - jQueryを使用して特定のテキストコンテンツが含まれている場合にのみ、要素にcssを適用するにはどうすればよいですか?

Question

http://jsfiddle.net/aWp2g/2/

CSS

.highlight {
    color: yellow;
}

html

<div>fox</div>
<div>brown</div>

jQuery

if ($('div').text() == 'fox') {
    this.addClass('highlight');
}

上記のコードが機能しません。特定のテキストを含む要素にクラスを追加して、強調表示 css を適用するようにします。

Answer 1

thisあなたのコードではwindowオブジェクトを参照しています。 .text()メソッドは、選択されたすべての要素のテキスト コンテンツを返します。戻り値は次のとおりです:foxbrownこれは と等しくありませんfox。

特定のテキストを含む:contains要素を選択するためにセレクターを使用できます。

$('div:contains(fox)').addClass('highlight');

完全に一致：

$('div').filter(function() {
   return (this.textContent || this.innerText) === 'fox';
}).addClass('highlight');

Answer 2

@undefined が述べたように

$('div').filter(function() {
   return (this.textContent || this.innerText) === 'fox';
}).addClass('highlight');

正常に動作するはずですが、jsfiddle に jquery を含めることも忘れないでください。そうしないと、正しく動作しません。