如何隱藏給定類的所有元素的父元素，但父元素也有特定的類？

我想隱藏所有具有類parent的li元素的實例，它們具有類child-1的直接子div元素。這裏的僞代碼示例，其中該方法hideParent()將隱藏所選擇的元件（一個或多個）的父：如何隱藏給定類的所有元素的父元素，但父元素也有特定的類？

$("li.parent > div.child-1").hideParent();

以下是我的HTML，其中，所述第二和第三li.parent元件應該被隱藏的實例。

<li class="parent"> 
    <div class="child-0"> ... </div> 
</li> 
<li class="parent"> 
    <div class="child-1"> ... </div> 
</li> 
<li class="parent"> 
    <div class="child-1"> ... </div> 
</li>

來源

2013-04-22 bwright

試試這個：

$("li.parent > div.child-1").parent().hide();

來源

2013-04-22 17:33:20 Joe

哦，哇。我應該想到這一點，現在覺得失去這個簡單的解決方案感到愚蠢。工作很好，謝謝！ – bwright 2013-04-22 17:37:35

直接選擇相應的子元素，針對他們的父母（由相關的選擇過濾），然後隱藏它們。

$("div.child-1").parent('li.parent').hide();

參見：
parent Documentation

來源

2013-04-22 17:33:42 nbrooks

也是一個有用的答案。雖然喬提供的答案首先出現，但它是新的信息。對我來說'parent（）'方法可以被過濾。我相信我會在將來使用它。謝謝！ – bwright 2013-04-22 17:42:06

另一種選擇是使用filter：

$("li").filter(function() { 
    var $this = $(this); 
    var isParent = $this.hasClass("parent"); 
    var childMatchCount = $this.children("div").filter(".child-1").length; 
    return isParent && childMatchCount; 
}).hide();

DEMO：http://jsfiddle.net/GEhfP/

雖然這可以在幾個方面進行優化。但對我來說，它更具「可讀性」，非常明確。使用jsperf，我可以得到filter工作最快的是：

$("li.parent").filter(function() { 
    return $(this).children("div.child-1").length; 
}).hide();

@喬的回答是速度最快：$("li.parent > div.child-1").parent()

來源

2013-04-22 17:41:56 Ian

如何隱藏給定類的所有元素的父元素，但父元素也有特定的類？

回答

相關問題