使用Jquery选择子元素而不是孙子元素

Question

我有一个嵌套的无序列表，如下所示：

<ul id="parent">
   <li>
      <ul> <!-- select this-->
        <li></li>
        <li>
            <ul>
                <li></li>
            </ul>
        </li>
      </ul>
   <li>
</ul>

我需要选择 #parent 的子元素，但不包括孙元素。

$(#parent).children('ul'); 选择所有子元素，包括孙元素。如何仅限于子元素？

- JCHASE11

---

你的问题不清楚。问题中的ul是#parent的孙元素。这就是为什么你得到的答案行不通的原因。另外，你还缺少一个</ul>。 - m59

Answer 1

$('#parent').children('>ul');

上述方法对于问题中的标记无效。

您需要使用子选择器

需要以下内容：

$('#parent > li > ul');

- kalley

Answer 2

使用Children方法应该可以解决问题。你确定你得到了孙子节点吗？你的选择器实际上应该返回0。

以下代码应该可以实现你想要的功能：

$('#parent>li').children('ul')

来自官方文档

对于一个代表一组DOM元素的jQuery对象，.children()方法允许我们在DOM树中搜索这些元素的子元素，并从匹配的元素构造一个新的jQuery对象。 .children()方法与.find()不同之处在于，.children()只向下遍历单个级别的DOM树，而.find()可以遍历多个级别以选择后代元素（孙子，等等）。

- Claudio Redi

Answer 3

将ul之前加上>；

$('#parent').children('>ul');

- Michael

Answer 4

修改您的原始选择器：$('#parent > li > ul')

- Blazemonger