如果子级包含类，则隐藏父级答案

【问题标题】：Hide parent if child contains class如果子级包含类，则隐藏父级
【发布时间】：2016-11-04 13:58:09
【问题描述】：

我关注了这个jQuery: Hide parent <td> if contains child <input> with specific class?，但它在我的代码中不起作用：

$(function() {
$(".video-list-item").filter(function() {
     return $('span', this).hasClass('.view-count');
}).hide();
});

https://jsfiddle.net/xzeeuotL/

【问题讨论】：

请准确描述您想要实现的目标
hasClass('view-count')

标签： javascript

【解决方案1】：

有两件事要解决，但你已经接近了。

1) 您没有将 Jquery 包含为 JSFiddle 的库

2) 在hasClass方法中你需要去掉类名中的.

$(function() {
$(".video-list-item").filter(function() {
     return $('span', this).hasClass('view-count');
}).hide();
});

这是一个工作小提琴

https://jsfiddle.net/rn2jzpfc/

【讨论】：

【解决方案2】：

你很亲密。您的代码中只有一个错误。当您检查是否有 hasClass 时，无需在前面加上 .。

还记得你需要包含 jquery。

$(function() {
  $(".video-list-item").filter(function() {
    return $('span', this).hasClass('view-count');
  }).hide();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="video-list-item">
  <span class="view-count">HIDE THIS</span>
</div>
<div class="video-list-item">
  <span>DON'T HIDE THIS</span>
</div>

不用 Jquery 也可以做到这一点

这是一个使用纯 javascript 的示例。

var divSel = document.querySelectorAll('.video-list-item > .view-count');

for (var i = 0; i < divSel.length; i++) {
  divSel[i].parentElement.style.display = "none";
}

<div class="video-list-item">
  <span class="view-count">HIDE THIS</span>
</div>
<div class="video-list-item">
  <span>DON'T HIDE THIS</span>
</div>

希望这会有所帮助。

【讨论】：

【解决方案3】：

接下来的代码返回具有video-list-item 类的元素的父类和view-count 类；然后隐藏父级。我认为这比您的方法更容易：

$(".view-count").closest('.video-list-item').hide();

更新 JSFiddle：https://jsfiddle.net/tomloprod/xzeeuotL/2/

【讨论】：

【解决方案4】：

另一种解决方案：

$(function() {
    $('.video-list-item').find('span.view-count').hide();
});

【讨论】：

【解决方案5】：

您必须根据您的情况更改该语法。

您必须确保您的 <td> 具有类似“.video-list-item”的类名，然后在 $('span', this) 中更改为 $('input', this)，当然，您输入的类名类似于view-count。像这样的..

$(function() {
$(".video-list-item").filter(function() {
     return $('input', this).hasClass('view-count');
}).hide();
});


<td class="video-list-item">
 <input class="view-count">
</td>

我希望它可以帮助你..美好的一天！

【讨论】：

【解决方案6】：

如果您想删除包含具有特定类的孩子的最接近的父级，这很有用：

<div class="closest_parent">
    <div></div>
    <div class="child_class"></div>
</div>
$('.child_class').closest('.closest_parent').remove();

【讨论】：