jQuery的，如果“this”载(jQuery if “this” contains)

I'm trying to change any elements containing a particular text string to a red color. In my example I can get the child elements to become blue, but there's something about the way I've written the 'Replace Me' line that is incorrect; the red color change doesn't happen. I note that the "contains" method is usually written as :contains but I couldn't get that to validate with $(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'); 
    }      
});

Fiddle: http://jsfiddle.net/zatHH/

Answer 1:

:contains一个选择。 要检查是否选择适用于给定的变量，你可以使用is ：

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

但是维加的解决方案是在这种情况下，更清洁。

Answer 2:

我不认为这是一个.contains在jQuery的功能。 有一个.contains功能，但此功能是用来查看是否DOM元素是另一个DOM元素的后代。 见。载文档。 （积分至@beezir ）

我认为你正在寻找:contains选择。 请参阅下面的更多细节，

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

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

Answer 3:

你可以用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> 

Answer 4:

我认为我们应该我们的文本转换为小写。 这是更好地检查与小写和大写。

$('#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 if “this” contains