好的,我说我有很多div.一些div,孩子们有一个班级,其他孩子们有不同的班级.
我想只隐藏有一个特定类的孩子的div.
例如,
<div class="mainDiv">
<div class="kulkul">
<div class="childA">
</div>
</div>
</div>
<div class="mainDiv">
<div class="lalala">
<div class="childB">
</div>
</div>
</div>
<div class="mainDiv">
<div class="kulkul">
<div class="childA">
</div>
</div>
</div>
<div class="mainDiv">
<div class="lalala">
<div class="childA">
</div>
</div>
</div>
<div class="mainDiv">
<div class="kulkul">
<div class="childB">
</div>
</div>
</div>
<div class="mainDiv">
<div class="lalala">
<div class="childA">
</div>
</div>
</div>
现在上面,假设我只想隐藏具有类.childB的子div的父div
据我所知(CSS3无论如何),这不能用CSS完成,因为CSS不允许你设置父div的样式,只允许子div.父母.mainDiv divs(我想隐藏的那些)都完全一样.
这样就留下了javascript.
使用上面的示例,如何隐藏包含带有.childB类的子div的所有.mainDiv div？
解决方法
根据其直系后裔隐藏父母元素
//Update the **sample-element-to-hide** with whatever you wanted to use as a child class with the parent element you wanted to hide e.g.,'childB'
var elementToHideList = document.getElementsByClassName("sample-element-to-hide");
for (var i = elementToHideList.length; i--;)
elementToHideList[i].parentNode.style.display = "none";
根据子元素隐藏父母元素.
//Solution for the OP
//Update the **childB** with whatever you wanted to use as a child class with the parent element you wanted to hide.
//Note that this would only works if the parent element has a **className** mainDiv. You can change mainDiv with your own parent className.
$('.classB').closest('.mainDiv').hide();
