使用 jquery 显示/隐藏第一级 div答案

【问题标题】：show/hide first level divs with jquery使用 jquery 显示/隐藏第一级 div
【发布时间】：2011-01-13 12:15:44
【问题描述】：

我想显示和隐藏body标签下的div，而不是另一个div标签下的div。

例如，在下面的代码中，我想用 jquery div1 和 div2 隐藏，而不是 div1A、div1B、div2A 和 div2B。我知道如果我隐藏 div1，那么 div1A 和 div1B 将被隐藏。

<body>
   <div id="div1">
       <div id="div1A"></div>
       <div id="div1B"></div>
   </div>
   <div id="div2">
       <div id="div2A"></div>
       <div id="div2B"></div>       
   </div>
</body>

我需要它，因为如果我这样做 $("div").hide();然后 $("div1").show(); div1A 和 div1B 仍然隐藏，因为 $("div").hide();隐藏它们，但是 $("div1").show();不影响他们。

我试过 $("body div").hide();但它与 $("div").hide(); 具有相同的效果

我需要一个只隐藏 div1 和 div2 的 jquery 调用。有什么方法可以做到这一点而不必设置类名？

谢谢。

【问题讨论】：

标签： jquery html show-hide

【解决方案1】：

试试这个...

$("body > div").hide();

'>' 强制选择仅在 body 标签的直接 div 子元素处停止，并且不会深入到 DOM 以选择所有 div 元素。

【讨论】：

【解决方案2】：

$('body > div').hide(); 是其他人已经指出的方法，但我只想指出，使用 children() 方法也可以，因为它选择元素的直接子元素：

$('body').children('div');

【讨论】：

【解决方案3】：

这是直接子选择器的工作：>

$('body > div').hide();

【讨论】：

对于以后发现此问题的任何人，这里是解决此类问题的最佳选择器资源：api.jquery.com/category/selectors