javascript - jQuery - タグのコンテンツが sometext と等しいかどうかを確認してから、何かを行います

Question

私のコンテンツにこれらの多くがあるとしましょうdiv：<cite class="fn">blabla</cite>

すべてciteのタグのコンテンツ(この場合: blabla) をクラスでチェックfnして、「sometext」と等しいかどうかを確認し、色を red に変更するにはどうすればよいですか?

とてもシンプルです。

Answer 1

$('cite.fn:contains(blabla)').css('color', 'red');

編集：「blablablabla」にも一致しますが。

$('cite.fn').each(function () {
    if ($(this).text() == 'blabla') {
        $(this).css('color', 'red');
    }
});

その方が正確なはずです。

編集: 実際には、bazmegakapa のソリューションはよりエレガントだと思います:

$('cite.fn').filter(function () {
    return $(this).text() == 'blabla';
}).css('color', 'red');;

Answer 2

驚くべき.filter()方法を利用できます。パラメータとして関数を使用できます。これにより、jQuery コレクションの要素がテストに合格した要素 (関数が true を返す要素) に削減されます。その後、残りの要素に対してコマンドを簡単に実行できます。

var searchText = 'blabla';

$('cite.fn').filter(function () {
    return $(this).text() === searchText;
}).css('color', 'red');

jsFiddle デモ

Answer 3

次のようなことができる可能性があります。

$('cite.fn').each(function() {
  var el = $(this);
  if (el.text() === 'sometext') {
     el.css({ 'color' : 'red' });
  }
});

citeこれにより、クラスを持つそれぞれに対して関数が起動されfnます。この関数は、現在citeの値が「sometext」と等しいかどうかをチェックします。

そうである場合は、CSS color（text-color）プロパティをに変更しredます。

この例では、質問に具体的にタグを付けているため、jQueryを使用していることに注意jQueryしてください。反対票を無視します。これは、（el.val()ではなくel.text()）作成したタイプミスを編集する前に適用されました。

Answer 4

jQueryなし：

var elms = document.querySelectorAll("cite.fn"), l = elms.length, i;
for( i=0; i<l; i++) {
    if( (elms[i].innerText || elms[i].textContent) == "blabla") {
        elms[i].style.color = "red";
    }
}