jQuery：只有直接后代选择器
我有以下结构：
<ul>
<li><a>link</a>
<ul>
<li>
<a>link</a>
<ul>
<li><a>link</a></li>
<li><a>link</a></li>
<li><a>link</a></li>
</ul>
</li>
<li>
<a>link</a>
<ul>
<li><a>link</a></li>
<li><a>link</a></li>
<li><a>link</a></li>
</ul>
</li>
</ul>
</li>
<li>
<div>content
<ul>
<li><a>link</a></li>
<li><a>link</a></li>
<li><a>link</a></li>
</ul>
</div>
</li>
<li><a>link</a></li>
<li><a>link</a></li>
<li><a>link</a></li>
</ul>
我只想选择直接位于
$('ul li> a')
我也会得到嵌套在 div 下的 ul 。有没有一种“干净”的方法来做到这一点？ 谢谢
ps：我想要一个通用选择器（这是一个菜单插件，所以我希望它忽略所有不直接落在菜单流中的锚标记）
I have the following structure :
<ul>
<li><a>link</a>
<ul>
<li>
<a>link</a>
<ul>
<li><a>link</a></li>
<li><a>link</a></li>
<li><a>link</a></li>
</ul>
</li>
<li>
<a>link</a>
<ul>
<li><a>link</a></li>
<li><a>link</a></li>
<li><a>link</a></li>
</ul>
</li>
</ul>
</li>
<li>
<div>content
<ul>
<li><a>link</a></li>
<li><a>link</a></li>
<li><a>link</a></li>
</ul>
</div>
</li>
<li><a>link</a></li>
<li><a>link</a></li>
<li><a>link</a></li>
</ul>
I wanna select only the anchors that fall directly under the <li> tags ( children) but not the ones that fall under other tags (grandchildren)
if i do
$('ul li> a')
I will also get the the ul which is nested under the div. is there a "clean" way to do this?
thank you
ps: I would like to have a generic selector ( this is for a menu pluggin so I want it to ignore all the anchor tags that don't fall directly in the flow of a menu)
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
最终解决方案
该答案已完全重新编辑以保持更新。最终的解决方案基本上是一个选择器，从原始
元素的 ID 开始，选择列表项中不会破坏菜单结构流程的所有锚点。也就是说，如果嵌套有或以外的元素，则不要选择这些元素中的任何内容，即使存在内的菜单。生成的选择器（
#root是主的 ID）：您可以在此处尝试演示：http://jsfiddle.net/9gPzQ/31/
然而，原始发布者@salmane想要为插件做这件事，它已经带有一个传入的元素，因此他想出了以下代码来执行与上面相同的操作，但在作为选择器上下文传递的已选定对象中：
其他有趣的选择器
在寻找解决方案的过程中，出现了某些有趣的选择器由于我对问题的误解，但我无论如何都会将它们放在这里只是为了记录，它可能对某些人有用。 :)
此选择器选择位于菜单顶层的列表项的锚点，无论它们位于页面上的任何位置：
此选择器选择位于菜单顶层的列表项的锚点，忽略嵌套的菜单在其他菜单中，即使它们嵌套在其他容器中：
您可以在此处的演示中尝试使用这些选择器： http: //jsfiddle.net/9gPzQ/4/
The Final Solution
This answer has been completely re-edited to keep it updated. The final solution is basically a selector, where starting from the original
<ul>element's ID, select all anchors within the list items that doesn't break the menu structure's flow. That is, if there is an element other than<ul>or<li>nested within, don't select anything within those elements, even if there is a menu within.The resulting selector (
#rootis the ID of the main<ul>) :You can try a demo over here: http://jsfiddle.net/9gPzQ/31/
However the original poster @salmane wanted to do it for a plugin, which already comes with an element passed in, so he came up with the following code to do the same as above, but within already selected objects passed as selector context:
Other interesting selectors
Along the way of finding a solution, certain interesting selectors came up due to my misunderstanding of the problem, but I'll include them here anyway just for the record, it might come in handy for some. :)
This selector selects the anchors of list items that are on the top level of a menu, wherever they are on the page:
This selector selects the anchors of list items that are on the top level of a menu, ignoring menus that are nested within other menus, even if they are nested within other containers:
You can try these to selector in a demo here: http://jsfiddle.net/9gPzQ/4/
我认为您正在寻找的是：
这将为您提供所有 li>a ，而不包含 div 或其中的任何内容。
I think what you're looking for is:
This will give you all the
li>a's without the div or anything in it.感谢 @DarthJDG 的出色输入，
这就是解决方案
this.content 是插入引用的对象，在这种情况下该对象是父 UL
我希望这对某人有帮助
Thanks to the Great input of @DarthJDG
this is the solution
this.content being the object referenced by the plugging in this case the object is the parent UL
I hope this helps someone