Question

我正在修改JQuery UI Accordion Menu，它目前的结构如下：

<h3>Title</h3>
<div>Children</div>
<h3 class="no-children">Title</h3>
<div>Children</div>
<h3>Title</h3>
<div>Children</div> ...

正如你所看到的，中间标题没有子节点，所以我想在CSS中做的就是选择在.no-children类之后发生的div并隐藏它。这些都没有嵌套，所以我不能这么简单。

我知道我可以display:none但我似乎无法选择正确的元素。

有办法做到这一点吗？

Answer 1

.nochildren+div{
  /* Style goes here */
}

这将选择一个DIV，该DIV前面紧跟一个具有.nochildren类的元素。这只有在两个元素都处于同一级别时才有效，许多旧版浏览器都会遇到问题。

Answer 2

如果您正在使用jQuery，可以通过一种简单的方法来执行此操作 Here

Answer 3

您可以使用

$('.no-children').next().hide();

或.nextUntil();

CSS方式

.no-children + div { display: none; }