在jquery中仅选择第一级元素

在jquery中仅选择第一级元素,jquery,html,css,css-selectors,Jquery,Html,Css,Css Selectors,如何从这样的列表中仅选择父级的链接元素 <ul> <li><a href="#">Link</a></li> <li><a href="#">Link</a> <ul> <li><a href="#">Link</a></li> <li><a href="#">Link</a></

如何从这样的列表中仅选择父级的链接元素

<ul>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a>
  <ul>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
  </ul>
</li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
所以在css中ulli a,但不是ulli a

谢谢

但如果您特别想针对最外层的ul,则需要在根ul上设置一个类:

<ul class="rootlist">
...
确保只有根li元素的另一种方法:

$("ul > li a").not("ul li ul a")

它看起来很笨拙,但是它应该做的技巧

一旦你有了初始的UL,你就可以使用这个方法,它只考虑元素的直接子集。正如@activa所指出的,轻松选择根元素的一种方法是给它一个类或id

您还可以使用$ul li:first child仅获取ul的直接子级

我同意,但是,你需要一个ID或其他东西来识别主UL,否则它只会选择他们所有。如果你在UL附近有一个ID的div,最简单的方法就是$someDiv>UL>li


第二个.form项位于.add_to_cart的树级子项

如果结果仍然向下流到子项,那么在许多情况下JQuery仍将应用于子项

$("ul.rootlist > li > a")
使用此方法: E>F匹配作为元素E的子元素的任何F元素

告诉JQuery只查找显式子级。

如其他答案所述,最简单的方法是通过ID或类名唯一地标识根元素,并使用直接后代选择器

$('ul.topMenu > li > a')
然而,我在寻找一种解决方案时遇到了这个问题,这种解决方案可以在DOM的不同深度处理未命名的元素

这可以通过检查每个元素并确保其在匹配元素列表中没有父元素来实现。这是我的,包装在jQuery选择器“topmost”中

jQuery.extend(jQuery.expr[':'], {
  topmost: function (e, index, match, array) {
    for (var i = 0; i < array.length; i++) {
      if (array[i] !== false && $(e).parents().index(array[i]) >= 0) {
        return false;
      }
    }
    return true;
  }
});
完整的JSIDLE可用。

尝试以下方法:

$("#myId > UL > LI")

我在任何深度的嵌套类上都遇到了一些问题,所以我解决了这个问题。它将只选择它遇到的包含Jquery对象的第一个级别:

var$elementsAll=$container.find.fooClass;4. var$levelOneElements=$elementsAll.not$elementsAll.children.find$elementsAll; $levelOneElements.css{color:red} 容器 一级 二级 一级 二级
简单地说,你可以用这个

$("ul li a").click(function() {
  $(this).parent().find(">ul")...Something;
}
参见示例:

1

 $("ul.rootlist > target-element")
2   $("ul.rootlist").find(target-element).eq(0) (only one instance)
3   $("ul.rootlist").children(target-element)

可能还有很多其他方法

Hmm我发现我的问题在于使用jquery1.2。我已经用1.3取代了它,这些选择器现在工作得很好。非常感谢您的回复和所有回复的人。如果您不想添加类,只需执行$ul:first>li a显然这只适用于第一级,而不适用于内部级。谢谢您的提示。我也测试过这个,它似乎工作得很好:ul.find>li;如果在ul变量中将ul节点作为JQuery对象。这是不正确的用法:first child。这将选择每个ul的第一个li。原来的帖子是问第一个ul的每一个li。谢谢,这对我很有帮助。一个$'ul'.first.children'li'也可能会被使用这是我的首选答案,因为我已经有了元素,所以将使用.children而不是.find。和往常一样,IE+Edge是唯一不支持它的>:-所以这里有一个polyfill,这个问题根本没有意义>>>那是什么?这个选择器有名字吗?它甚至是有效的选择器吗?还是开玩笑?
jQuery.extend(jQuery.expr[':'], {
  topmost: function (e, index, match, array) {
    for (var i = 0; i < array.length; i++) {
      if (array[i] !== false && $(e).parents().index(array[i]) >= 0) {
        return false;
      }
    }
    return true;
  }
});
$('ul:topmost > li > a')

// Or, more simply:
$('li:topmost > a')
$("#myId > UL > LI")
$("ul li a").click(function() {
  $(this).parent().find(">ul")...Something;
}
 $("ul.rootlist > target-element")
2   $("ul.rootlist").find(target-element).eq(0) (only one instance)
3   $("ul.rootlist").children(target-element)