javascript - 仅当 DIV > TABLE >TR 可见时才显示 DIV > SPAN

Question

我有一个看起来像这样的布局

<div class="categoery">
    <span>categorie title</span>
    <table>
        <tr class="item show">....</tr>
        <tr class="item show">....</tr>
        <tr class="item none">....</tr>
    </table>
</div>

<div class="categoery">
    <span>categorie title</span>
    <table>
        <tr class="item none">....</tr>
        <tr class="item none">....</tr>
        <tr class="item none">....</tr>
    </table>
</div>

现在我想要的是以下内容。第一个 div 将是类别标题和两行。

现在在第二个 div 中，我希望整个 div 完全隐藏。

CSS 没有像这样的父选择器:div < tr.none{ display:none; } .

我假设我可以使用的另一件事是 jQuery 的 hasClass，但我想知道是否有纯 CSS 方法。

==

也许类似于将 div 设置为 height:0，但是具有上边距的 block 元素 (tr) 会强制 div 展开？

希望这是有道理的。

Answer 1

你可以这样做

$('.categoery').each(function(k,v) {
    if($(this).children('table').find("tr").css("display")=='none') {
    // alternate
  //if($(this).children('table').find("tr").hasClass("none")) {
        $(this).children('span').hide();
    }
});

我什至创建了一个 demo .我希望这就是所要求的。