如果有特定的班級，則將班級添加到父級div

Question

如果.widget-content li a具有特定的類.ifthis嘗試將類添加到父div <div class="widget-content"> 。

HTML：

<div class="widget-content">
<ul>
<li><a href="https://twitter.com/slycolor" class="ifthis"> <b>This Text Should Red</b></a>
</li>

<li><a href="https://www.facebook.com/slycolor" class="ifthis"> <b>This Text Should Red</b></a>
</li>
</ul>
</div>

我已經試過了：

$('.widget-content li a').has('.ifthis').parent('.widget-content').addClass('social-sidebar'); 

但沒有工作，看到這個例子小提琴 。

Answer 1

選擇具有ifthis孩子，然后使用parents()或closest()選擇其父級

$('.widget-content li a.ifthis').parents('.widget-content').addClass('social-sidebar'); 

要么

$('.widget-content li a.ifthis').closest('.widget-content').addClass('social-sidebar');

您的代碼無法正常工作，因為，

1. has()將僅檢查其后代是否包含該選擇器，而需要使用filter() 。
2. parent()將僅選擇直接父級，因此您應使用parents()或closest() 。

用你的代碼：

$('.widget-content li a').filter('.ifthis').parents('.widget-content').addClass('social-sidebar'); 

Answer 2

用這個：

$('a.ifthis').closest('div.widget-content').addClass('social-sidebar');

要么：

$('.ifthis').closest('.widget-content').addClass('social-sidebar');
//if only a elements have .ifthis and only div elements have .widget-content

要么：

$('.widget-content:has(.ifthis)').addClass('social-sidebar');

參考： https : //api.jquery.com/closest/
https://api.jquery.com/has-selector/

.closest（選擇器）-返回：jQuery

說明：對於集合中的每個元素，通過測試元素本身並遍歷DOM樹中的其祖先，獲得與選擇器匹配的第一個元素。

：has（）選擇器

jQuery（“：has（selector）”）-返回：jQuery

說明：選擇包含至少一個與指定選擇器匹配的元素的元素。