1

我有一个 cms 为我正在设计的网站呈现菜单,我需要选择父菜单项的子项。以下是代码的生成方式:

<div class="menu">
    <ul>
         <li></li>
         <li><a href="" class="CurrentButton" ... />text</a>
              <div>
                   <ul></ul>
              </div>
         </li>
    </ul>
</div>

我已经尝试过这个 CSS 来尝试选择它,但是除了显示之外它还没有成功:none;

.menu ul li div {
    display: none;
}

.menu > ul > li > a.CurrentButton div {
    display: block;
}

谁能看到我做错了什么?jquery函数会更容易吗?我对 jquery 还很陌生,所以我不确定如何为它编写一个函数。

当 li 中的锚点具有 CurrentButton 类时,我试图选择 li 中的 div,如果 li 中的锚点没有类,那么我希望它隐藏

4

4 回答 4

1

If you really need to be specific, use the adjacent elements operator ( + )

.menu > ul > li > a.CurrentButton + div {

Otherwise, you are targeting a div that is the descendent of CurrentButton and that doesn't exist.

If you don't need to be so specific, use the same selector as before:

.menu > ul > li > div {
于 2013-10-15T17:58:23.123 回答
1

您提供的两个示例都依赖于查找.menu元素,但您的代码中不存在任何元素。现在可以了。

a.CurrentButton div选择任何s 的任何divs 内部。a.CurrentButton但是,您的 div 不在as. 尝试这个:

.menu ul > li > a {
    //selects all the as, but non of the divs
}

.menu ul > li > * {
    //selects anything inside a 'li', both 'a's and 'div's
}

要选择divs之后的a.CurrentButtons,请使用以下命令:

.menu ul li > a.CurrentButton + div {
    //any 'div's that are directly after 'a.CurrentButton'
}
于 2013-10-15T17:59:42.023 回答
0

Assuming the <ul> above is a child of an element with the class .menu, the <div> above is not a child of a.CurrentButton, so you should select it like this:

.menu > ul > li > div {
    display: block;
}

Just so you know > only selects direct children of an element.

于 2013-10-15T17:58:36.053 回答
0

Try this:

In your HTML div is a sibling of a.CurrentButton. So, you should use + sign.

.menu ul li div {
    display: none;
}

.menu > ul > li > a.CurrentButton + div {
    display: block;
}
于 2013-10-15T17:59:09.783 回答