如果没有子jQuery,则显示无元素

时间:2014-07-24 13:35:59

标签: jquery children

所以我有一个包含一些div的aside元素。 div是用PHP生成的,有时候旁边没有div子。

我想要的是在父母没有任何div孩子的情况下将其隐藏起来。

到目前为止,我已尝试过不同的解决方案

if($('aside').length)
    {
        if($('aside').find('*').length == 0)
        {
            $('aside').hide();
        }
    }

obv不工作。

php看起来像那样

<aside>
    <div class="children1"></div>
    <div class="children2"></div>
</aside>

3 个答案:

答案 0 :(得分:1)

您可以使用此功能隐藏所有没有子项的aside元素:

$('aside').filter(function(){ return !$(this).children().length }).hide()

Demonstration

请注意,如果要编写元素,通常很容易在PHP中进行测试,而在相反的情况下,只需编写aside元素即可。

,而不是发送HTML并将其擦除到客户端,而不是发送它。

答案 1 :(得分:1)

以下内容将隐藏所有不包含任何内容的旁边标记。

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

但是,如果它包含空格或空子节点

,则它不起作用

经过大量的摆弄后,我发现如果你想做这个客户端,那么你最好的选择就是迭代所有的旁白并确定哪些不包含任何有意义的东西。以下代码似乎可以充分发挥作用。

$('aside').each (function (index, elem) {
    elem = $(elem);
    if ('' == elem.text ().trim ()) {
        elem.hide ();
    }
});

JSFiddle here

但是,如果没有任何内容可以生成服务器端,那么最好不要在标记中包含所有内容。无论用户是否启用了javascript,它都会减少您需要发送的数据量(略微)并正确呈现。

答案 2 :(得分:-1)

注意脚本的运行时间

$(document).ready(function(){
    if ( !$('aside').children().length )
        $('aside').hide();
};

此外,您不应通过其TagType('旁边')引用该元素。使用标识符或类。