从第一级选择元素答案

【问题标题】：Select elements from first level从第一级选择元素
【发布时间】：2015-02-25 13:05:00
【问题描述】：

我有这个 ul li 列表：

<ul>
  <li><div>Text</div><a href="#">A</a></li>
  <li><div>Text</div><a href="#">B</a></li>
  <li><div>Text</div><a href="#">C</a></li>
  <li>
    <ul>
      <li><div>Text</div><a href="#">A1</a></li>
      <li><div>Text</div><a href="#">B1</a></li>
      <li><div>Text</div><a href="#">C1</a></li>
      <li><div>Text</div><a href="#">D1</a></li>
    </ul>
  </li>
  <li><div>Text</div><a href="#">E</a></li>
</ul>

我需要从第一级中选择所有“li”元素。

在本例中为：

  <li><div>Text</div><a href="#">A</a></li>
  <li><div>Text</div><a href="#">B</a></li>
  <li><div>Text</div><a href="#">C</a></li>
  <li><div>Text</div><a href="#">E</a></li>

尝试使用：

  $('ul').children()

我从第一层和第二层得到所有“li”元素。

非常感谢。

【问题讨论】：

那是因为你匹配了所有<ul> 元素，在任何级别。您必须确定您感兴趣的<ul> 元素（例如通过id 或class）才能实现您想要的。
Selecting only first-level elements in jquery的可能重复
“我需要从第一级中选择所有“li”元素。” - 不，在您的示例中，您表示您想要所有第一级 li 元素' 不包含 ul，与 all 第一级 li 元素相比。无论如何，你有什么理由不能给有问题的 ul 一个 id 或类？

标签： javascript jquery jquery-selectors

【解决方案1】：

您可以将选择器更改为

$("'whatever element is above first level ul element' > ul > li")

【讨论】：

但是ul 匹配第二级列表，所以这也会得到他们的li。
然后在选择器的第一个 ul 上方包含标签

【解决方案2】：

你可以给第一个ul添加一个类，然后调用.children()

【讨论】：

【解决方案3】：

给外部ul一个类：

<ul class="my_ul">
....
</ul>

在 jquery 中你可以得到它们：

  $('.my_ul').children()

编辑：我的第一个代码是生孩子。

【讨论】：

你给他们上同一个课，你不是说只给外面的那个课吗？

【解决方案4】：

选择ul:first 中的li，其中没有ul 元素作为子元素。

$('ul:first').children('li:not(:has(ul))');

Fiddle

【讨论】：

请注意，这只适用于显示的 html sn-p。如果那是更大页面的一部分，上面还有其他 ul 元素，那么显然it wouldn't work。

【解决方案5】：

试试

$('ul>li').css(//your doing//);

这将在您的代码中选择all ul tags 中的direct childs。

如果您想访问特定的ul，请尝试给它一个class 或id。

【讨论】：

【解决方案6】：

您可以使用以下代码搜索第一个 ul，然后搜索所有 li： $('ul:first>li')

【讨论】：