jQuery:只有直接后代选择器

我有以下结构:

 

我想只选择直接落在

  • 标签(儿童)下的锚点,而不是那些属于其他标签(孙子)的锚点,如果我这样做的话

     $('ul li> a') 

    我也将获得嵌套在div下面的ul。 有一种“干净”的方式来做到这一点? 谢谢

    ps:我想有一个通用选择器(这是一个菜单插件,所以我希望它忽略所有不直接落在菜单流中的锚标签)

    最终的解决方案

    此答案已完全重新编辑以保持更新。 最终解决方案基本上是一个选择器,从原始

      元素的ID开始,选择列表项中不会破坏菜单结构流的所有锚点。 也就是说,如果嵌套在

      • 之外的元素,则不要在这些元素中选择任何内容,即使其中有菜单也是如此。

        生成的选择器( #root是主

          的ID):

           $('#root > li > a, #root ul:not(#root :not(ul,li) ul) > li > a') 

          你可以试试这里的演示: http : //jsfiddle.net/9gPzQ/31/

          然而原始海报@salmane想要为插件做这件事,已经传入了一个元素,所以他提出了以下代码来执行与上面相同的操作,但在已经选择的对象中作为选择器上下文传递:

           $('li >a',this.content).not($(':not(ul,li) a',this.content)) 

          其他有趣的选择器

          在寻找解决方案的过程中,由于我对这个问题的误解,出现了一些有趣的选择器,但是我将它们包含在这里仅仅是为了记录,它可能会派上用场。 🙂

          此选择器选择位于菜单顶层的列表项的锚点,无论它们在页面上的何处:

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

          此选择器选择位于菜单顶层的列表项的锚点,忽略嵌套在其他菜单中的菜单,即使它们嵌套在其他容器中:

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

          您可以在这里的演示中尝试这些选择器: http : //jsfiddle.net/9gPzQ/4/

          我想你要找的是:

           $('ul:parent ul li>a') 

          这将给你所有的li>a没有div或其中的任何东西。

          感谢@DarthJDG的出色表现

          这是解决方案

           $('li >a',this.content).not($(':not(ul,li) a',this.content)) 

          this.content是插件引用的对象,在这种情况下,对象是父UL

          我希望这可以帮助别人

          Interesting Posts