jQuery：如果元素包含文本，则将类添加到父div

Question

如果其中一个子元素包含单词“赞助”，我需要为父级 div 添加一个类。

<div id="post-item">   
  <span class="tags">
      <a href="#">Blogs</a>            
  </span>         
</div>

<div id="post-item">   
  <span class="tags">
      <a href="#">Sponsored by Lorem Ipsum</a>            
  </span>       
</div>

我正在尝试使用parent().addClass，但由于某些原因它不起作用。您可以在这个jsfiddle示例中查看。

if (jQuery('a:contains("Sponsored")').length) {
    jQuery(this).parent('#post-item').addClass('sponz');

}

非常感谢任何帮助！

- user3263728

Answer 1

IDs必须唯一，因此使用class来标识父级。您可以使用.closest()来标识带有class post-item的父级。

<div class="post-item">   
  <span class="tags">
      <a href="#">Blogs</a>  
    <h3>Lorem</h3>          
  </span>         
</div>

<div class="post-item">   
  <span class="tags">
      <a href="#">Sponsored by Lorem Ipsum</a>            
  </span>       
    <h3>Lorem</h3>
</div>

JavaScript

jQuery('a:contains("Sponsored")').closest('.post-item').addClass('sponz');

演示

---

:has() 选择器 也可以使用。

选择包含至少一个匹配指定选择器的元素的元素。

jQuery('.post-item:has(a:contains("Sponsored"))').addClass('sponz');

- Satpal

---

谢谢！这是一个很好的修复。 - user3263728

Answer 2

您不需要检查长度，它会返回一个元素或者不返回，您需要使用closest()，因为#post-item不是直接父元素。

我使用类名，因为您不能使用重复的ID。

$('a:contains("Sponsored")').closest('.post-item').addClass('sponz');

演示代码

- adeneo

---

谢谢！！这正是它无法工作的原因，也是一个很好的修复。 - user3263728

Answer 3

以下应为您的JavaScript代码。

$(document).ready(function () {
    jQuery('a:contains("Sponsored")').closest('#post-item').addClass('sponz');
});

演示

- Krishanu Dey