Jquery：检查 div 是否包含文本，然后操作答案

【问题标题】：Jquery: Checking to see if div contains text, then actionJquery：检查 div 是否包含文本，然后操作
【发布时间】：2009-05-23 22:08:13
【问题描述】：

我正在尝试在 jQuery 中检查 div 是否包含一些文本，如果包含，则添加一个类。

所以我写了这样的东西：

    if( $("#field > div.field-item").text().indexOf('someText') = 0) {
        $("#somediv").addClass("thisClass");
    }

我没有让这个工作。

<div id="field"><div class="field-item">someText</div></div>

<div id="somediv"></div>

这不正确吗？

【问题讨论】：

标签： jquery

【解决方案1】：

您的代码包含两个问题：

JavaScript 中的相等运算符是 ==，而不是 =。
jQuery.text() 将匹配元素的所有文本节点连接成一个字符串。如果您有两个连续的元素，其中第一个包含'some'，第二个包含'Text'，那么您的代码将错误地认为存在一个包含'someText' 的元素。

我建议改为：

if ($('#field > div.field-item:contains("someText")').length > 0) {
    $("#somediv").addClass("thisClass");
}

【讨论】：

我在 div 中有两种类型的文本“关注”和“关注”。如何使用 div 查找准确的文本。例子。 5 个带“关注”的 div 和 2 个带“关注”的 div，显示 7 个“关注”和 2 个“关注”

【解决方案2】：

Ayman 是对的，但是你也可以这样使用它：

if( $("#field > div.field-item").text().indexOf('someText') >= 0) {
        $("#somediv").addClass("thisClass");
    }

【讨论】：

这对我有用！谢谢?

【解决方案3】：

这应该可以工作并且不区分大小写

function has_text(selector, text){
    text = text.toLowerCase();
    return selector.text().toLowerCase().indexOf(text) > -1
}

// for test
var exists = has_text($('#test_id'), 'hello');
console.log(exists)

【讨论】：

【解决方案4】：

是的，我现在为我考虑。而且效果很好！！！

if($("div:contains('CONGRATULATIONS')").length)
                        {
                            $('#SignupForm').hide(500);
                        }

【讨论】：

【解决方案5】：

这是 2020 年的原生 Javascript 解决方案：

const fieldItem = document.querySelector('#field .field-item')
fieldItem.innerText === 'someText' ? fieldItem.classList.add('red') : '';

【讨论】：

【解决方案6】：

if( $("#field > div.field-item").text().indexOf('someText') >= 0)

有些浏览器会包含空格，有些则不会。 >= 适合这里。否则相等是双重等于==

【讨论】：

【解决方案7】：

为什么不简单

var item = $('.field-item');
for (var i = 0; i <= item.length; i++) {
       if ($(item[i]).text() == 'someText') {
             $(item[i]).addClass('thisClass');
             //do some other stuff here
          }
     }

【讨论】：

无效响应，.是选择一个类，而不是一个 div id

【解决方案8】：

您可能想试试contains 选择器：

if ($("#field > div.field-item:contains('someText')").length) {
    $("#somediv").addClass("thisClass");
}

另外，如前所述，您必须使用 == 或 === 而不是 =。

【讨论】：

【解决方案9】：

HTML

<div id="field"><div class="field-item">someText</div></div>
<div id="somediv"></div>

JS

 $( document ).ready(function() {
 if ($('div.field-item:contains("someText")').length > 0) {

$('div#somediv').append("<p>someText was there, so class 'thisClass' was added").addClass("thisClass")
.css("border","2px red");
  }
});

JSfiddle：

https://jsfiddle.net/Loqctuaf/

【讨论】：