EX：

Question

这是一个简单的问题，但我似乎无法在stackoverflow上的任何地方找到答案。

我有以下代码段：

<div>//The div to be hidden
    <div></div>//I don't want to hide this div
    <div></div>//Nor this one
</div>

我之所以这样做是因为，当我隐藏div时，我使用他们的标记名隐藏它们，但当我显示它们时，我使用它们的类名。因此，内部或“嵌套的div”不再出现。

EX：

在：

<div>
    <div></div>
    <div></div>
</div>
<div></div>
<div>
    <div></div>
    <div></div>
</div>

后：

<div style="display:none;">
    <div></div>
    <div></div>
</div>
<div style="display:none;"></div>
<div style="display:none;">
    <div></div>
    <div></div>
</div>

Answer 1

我假设提供的代码在另一个元素中。我打电话给div#root

<div id="root">
    <div>
        <div></div>
        <div></div>
    </div>
    <div></div>
    <div>
        <div></div>
        <div></div>
    </div>
</div>

要隐藏div的所有直接#root子项，您可以使用选择器#root > div。

因此，您的jQuery可能看起来像$('#root > div').hide()

这是你想要做的吗？

Answer 2

我想这就是你想要实现的目标。

$( "div:first" ).hide();

这将隐藏页面上的第一个div。但无论如何我建议使用这个类或id ...

因此，如果你有更多这些，你应该基本上检查他们的父元素是div，如果是，那么不要隐藏它们，否则隐藏。所以......

            $('div').each(function(){
                _this = $(this);
                if(!_this.parent().is("div")){
                    _this.hide();
                }
            });

隐藏div，而不隐藏它的嵌套div

EX：

2 个答案: