如果一个没有内容或为空,则隐藏多个列表项

Question

我有一大堆列表项,其中包含更多列表项.

总之<li id="company-name" class="hide">,我想检测这个元素是否为空.

如果它是空的,我想<li class="hide">在直接父<ul></ul>元素中隐藏ALL .

<ul>
    <li>
        <ul class="greyul">
            <li>Location:</li>
            <li class="hide">Company:</li> <!-- DONT HIDE -->
        </ul>
        <ul class="whiteul">
            <li>Melbourne</li>
            <li id="company-name" class="hide"></li> <!-- HIDE -->
            <li class="hide">Sydney</li> <!-- HIDE ALSO-->
        </ul>
    </li>
</ul>

Answer 1

你可以使用简单的css选择器:空

.hide:empty{
    display: none;
}

使用jQuery:

$('.hide:empty').hide();

如果你想隐藏父div,那么你可以使用:

$('.hide:empty').parent().hide();

根据您更新的问题,您可以使用not selector并包含这样的选择器:

$('.hide:not(:contains("Company:"))').hide();