Question

如何只选择第一级li？如果我做'ul li'，它也会选择孩子。有没有办法只选择顶级而不是使用CSS的孩子？如果没有，我可以使用jQuery，但在那种情况下如何选择呢？

<ul>
    <li class="administration first">
        <a href="/administration.aspx"><span>Administration</span></a>
        <ul>
            <li class="users first selected"><a href="/administration/users.aspx"><span>Users</span></a></li>
            <li class="forms last"><a href="/administration/forms.aspx"><span>Forms</span></a></li>
        </ul>
        <div style="clear: both;"></div>
    </li>
    <li class="analytics"><a href="/analytics.aspx"><span>Analytics</span></a></li>
    <li class="options"><a href="/options.aspx"><span>Options</span></a></li>
    <li class="system last"><a href="/system.aspx"><span>System</span></a></li>
</ul>

Answer 1

您需要在第一个ul之上的元素或类，然后指定{parent-selector} > ul > li。

Answer 2

$（“ul：first＆gt; li”）。

Answer 3

如果您的ul有类或ID，您可以这样做：

$('#myList > li')

Answer 4

快速修复，如果可能的话，可以在外部ul上添加一个类名，然后选择$('ul.myClassName > li')。

另一个选项：$('ul > li:has(ul)')除了最后一个嵌套级别外，它将为您提供所有选项。

Answer 5

您可以使用：

$('ul li:not(ul li ul li)')

这将仅选择顶级，但您也希望在第一个ul上使用某种id或类选择器，否则它可能会干扰页面内容等。

Answer 6

parent/child的jQuery选择器语法是：

$('ul > li')

子组合子（E> F）可以被认为是后代组合子（E F）的一种更具体的形式，因为它只选择第一级后代。

使用您拥有的结构，您可能还需要指定ul父元素。

Answer 7

$(".analytics:parent > li")

适用于这种特定情况，但最好给顶级一个类或id。

类似的东西：

$("#top-level-ul > li")

似乎比选择li

之一的父级更容易理解

Answer 8

$('ul li').not('ul ul li')如何？如果需要，您可以做进一步说明以排除ul ol li和ol ul li

Answer 9

如果有一个类

，则将类添加到第一个类

  // Add a class to the first UL element      
  $(".wrapper > ul").addClass("first-level");

  // Target the first classes first li child
  $(".wrapper ul.first-level > li:first-child");

ie8和更低版本存在一些问题。

Answer 10

使用通常表现更好的JQuery遍历：

鉴于它是页面上的第一个UL：

$("ul").first().children();

鉴于父元素具有ID：

$("#TagID").find("ul").first().children();

鉴于UL有一个类：

$("ul.myClass").children();

鉴于UL有ID：

$("#MyID").children();

给出第一个LI具有特定类的示例：

$("li.administration").parent().children();

Answer 11

$（'ul li：first'）

如何在递归菜单中只选择顶级li？

11 个答案: