如果子节点包含类,则隐藏父节点

Hide parent if child contains class

本文关键字:隐藏 父节点 子节点 包含类 如果      更新时间:2023-09-26

我遵循这个jQuery:If包含子元素有特定的类别吗?但是它在我的代码中不起作用:

$(function() {
$(".video-list-item").filter(function() {
     return $('span', this).hasClass('.view-count');
}).hide();
});
https://jsfiddle.net/xzeeuotL/

有两件事需要解决,但你已经很接近了。

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

2)在hasClass方法中,您需要删除类名中的.

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

这是一个工作小提琴

https://jsfiddle.net/rn2jzpfc/

你差一点。只是你代码中的一个错误。当你检查是否有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>

下一个代码返回具有view-count类的元素的video-list-item类的父类;然后隐藏父节点。我认为这比你的方法更简单:

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


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

另一个解决方案:

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

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

你必须确保你的<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>
我希望它能帮助你…美好的一天! !

如果你想删除包含特定类的子元素的最接近的父元素,

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