jquery - 「これ」が含まれている場合のjQuery

Question

特定のテキスト文字列を含む要素を赤色に変更しようとしています。私の例では、子要素を青くすることができますが、'Replace Me' 行の書き方に誤りがあります。赤い色の変化は起こりません。「含む」メソッドは通常次のように記述されていることに注意して:containsください$(this)。

$('#main-content-panel .entry').each(function() {
       $(this).css('color', 'blue');      
});         

$('#main-content-panel .entry').each(function() {
   if($(this).contains("Replace Me").length > 0) {
        $(this).css('color', 'red'); 
    }      
});

フィドル: http://jsfiddle.net/zatHH/

score 82 · Accepted Answer

:containsセレクターです。セレクターが特定の変数に適用されるかどうかを確認するには、次を使用できますis。

if($(this).is(':contains("Replace Me")'))

ただし、この場合、ベガのソリューションはよりクリーンです。

score 18 · Accepted Answer

~~.containsjQueryには機能がないと思います。~~関数があり.containsますが、その関数は、DOM 要素が別の DOM 要素の子孫であるかどうかを確認するために使用されます。.contains のドキュメントを参照してください。（@beezirへのクレジット）

:containsセレクターを探していると思います。詳細については、以下を参照してください。

$('#main-content-panel .entry:contains("Replace Me")').css('color', 'red');

http://jsfiddle.net/zatHH/1/

score 14 · Accepted Answer

match特定の要素内のテキストを見つけるために使用できます

$('#main-content-panel .entry').each(function() {
    $(this).css('color', 'blue');      
});			

$('#main-content-panel .entry').each(function() {
    if($(this).text().match('Replace Me')) {
        $(this).css('color', 'red'); 
    }      
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="main-content-panel">
    <div class="entry">ABC</div>
    <div class="entry">ABC Replace Me</div>
    <div class="entry">ABC</div>
    <div class="entry">ABC Replace Me</div>
</div>

score 5 · Accepted Answer

テキストを小文字に変換する必要があると思います。小文字と大文字で確認した方が良いです。

$('#main-content-panel .entry').each(function() {
    var ourText = $(this).text().toLowerCase(); // convert text to Lowercase
    if(ourText.match('replace me')) {
        $(this).css('color', 'red'); 
    }      
});

jquery - 「これ」が含まれている場合のjQuery

4 に答える 4

Related

Reference