如果div包含特定单词，则使用jquery在父div中添加一个新类

这是HTML代码：

<div class="menu-3-cat">
<div class="menu-item-category">Offer</div>
</div> 

它应该是可行的，并将类“makemered”添加到父div“menu-3-cat”中，但它没有。我做错了什么

---

JSFIDLE

好的，您的小提琴大约有4个问题

您没有包括jQuery

您没有将脚本包装在

$（document）.ready（function（）{….}）中。现在，由于您处于一种混乱状态，您有时可以摆脱它，因为有些东西会被注入，但是如果您在常规页面上运行该代码，那么如果没有document.ready，它将无法（可靠地）工作

您正在检查是否完全相等。这听起来不错，但有空白，你没有解释。如果您将其更改为

Offer

，则您将看到不同之处

您的代码没有执行问题中描述的操作

$(document).ready(function(){
    if ($('.menu-item-category').text() === 'Offer') {
        $('.menu-3-cat').addClass('make-me-red');
    }
 })

这是你的小提琴，正在演奏

编辑：根据您的确切目标，使用修剪或子字符串比检查精确相等效果更好

编辑2：根据注释，您有多个块，因此需要迭代。试着这样做：

    $(document).ready(function(){   
        $('.menu-item-category').each(function(){
            var $this = $(this);
            if($this.text().indexOf('Offer') > -1)
                $this.closest('.menu-3-cat').addClass('make-me-red')
            })  
         })

---

好的，你的小提琴有四个问题

您没有包括jQuery

您没有将脚本包装在

$（document）.ready（function（）{….}）中。现在，由于您处于一种混乱状态，您有时可以摆脱它，因为有些东西会被注入，但是如果您在常规页面上运行该代码，那么如果没有document.ready，它将无法（可靠地）工作

您正在检查是否完全相等。这听起来不错，但有空白，你没有解释。如果您将其更改为

Offer

，则您将看到不同之处

您的代码没有执行问题中描述的操作

$(document).ready(function(){
    if ($('.menu-item-category').text() === 'Offer') {
        $('.menu-3-cat').addClass('make-me-red');
    }
 })

这是你的小提琴，正在演奏

编辑：根据您的确切目标，使用修剪或子字符串比检查精确相等效果更好

编辑2：根据注释，您有多个块，因此需要迭代。试着这样做：

    $(document).ready(function(){   
        $('.menu-item-category').each(function(){
            var $this = $(this);
            if($this.text().indexOf('Offer') > -1)
                $this.closest('.menu-3-cat').addClass('make-me-red')
            })  
         })

---

代码中有两个问题，div中有一个空行，其中包含文本“Offer”，因此将其与if语句中的

Offer

进行比较时，返回false。我删除了div中的空格，因此if语句返回true

您还需要一个documentready标记，以便在页面加载时运行if语句

这是完整的工作代码

$（文档）.ready（函数（）{
如果（$（'.menu-item-category'）。text（）=='Offer'）{
$（'.menu-3-cat'）.addClass（'make-me-red'）；
}
});
.menu-3-cat{
位置：相对位置；
溢出：隐藏；
}
.把我弄红{
背景#F44336；
颜色：#ffffff；
}

提供
您的代码中有两个问题，div中有一个空行，其中包含文本“Offer”，因此将其与if语句中的
Offer
进行比较时，返回false。我删除了div中的空格，因此if语句返回true

您还需要一个documentready标记，以便在页面加载时运行if语句

这是完整的工作代码
$（文档）.ready（函数（）{
如果（$（'.menu-item-category'）。text（）=='Offer'）{
$（'.menu-3-cat'）.addClass（'make-me-red'）；
}
});
.menu-3-cat{
位置：相对位置；
溢出：隐藏；
}
.把我弄红{
背景#F44336；
颜色：#ffffff；
}

提供
根据您的JSFIDLE和注释，您需要比较每个选定元素的
文本（）。否则，将返回“匹配元素集中每个元素的组合文本内容”

一种方法是迭代元素：

我还添加了删除元素文本内容中任何空白的功能


var$categories=$（'.menu-item-categority'）；
$categories.each（函数（）{
var$this=jQuery（this）；
如果（$this.text（）.trim（）=='Offer'）{
$this.closest（'.menu-3-cat'）.addClass（'make-me-red'）；
}
});
.menu-3-cat{
位置：相对位置；
溢出：隐藏；
}
.把我弄红{
背景#F44336；
颜色：#ffffff；
}

东西
提供
东西
根据您的JSFIDLE和注释，您需要比较每个选定元素的
文本（）。否则，将返回“匹配元素集中每个元素的组合文本内容”

一种方法是迭代元素：

我还添加了删除元素文本内容中任何空白的功能


var$categories=$（'.menu-item-categority'）；
$categories.each（函数（）{
var$this=jQuery（this）；
如果（$this.text（）.trim（）=='Offer'）{
$this.closest（'.menu-3-cat'）.addClass（'make-me-red'）；
}
});
.menu-3-cat{
位置：相对位置；
溢出：隐藏；
}
.把我弄红{
背景#F44336；
颜色：#ffffff；
}

东西
提供
东西
您希望何时发生这种情况？加载、单击（某物）等？我希望在页面加载时触发此命令。类“菜单项类别”中是否有多个元素？您在问题中包含的代码与您的JSFIDLE中的代码不同，我有一种预感，这将使所有这些都有所不同。JSFIDLE中的
.text（）
在单词“Offer”之前有一个换行符，因此如果
条件为
false
@showdev yes，则会生成一个包含12个元素的列表，但其中只有一个元素具有文本“Offer”，您希望何时出现这种情况？加载、单击（某物）等？我希望在页面加载时触发此命令。类“菜单项类别”中是否有多个元素？您在问题中包含的代码与您的JSFIDLE中的代码不同，我有一种预感，这将使所有这些都有所不同。y中的
.text（）