jQuery:只有直接后代选择器

前端之家收集整理的这篇文章主要介绍了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>

我只想选择直接落在< li>下的锚点标签(儿童),但不是其他标签(孙子)的标签
如果我做

$('ul li> a')

我也会得到嵌套在div下的ul.有没有一个“干净”的方式来做到这一点?
谢谢

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

解决方法

最终的解决方

这个答案已经完全重新编辑,以保持更新.最终解决方案基本上是一个选择器,从原始的< ul>元素的ID,选择列表项中不会破坏菜单结构的流的所有锚点.也就是说,如果存在< ul>以外的元素或< li>嵌套在内,不要选择这些元素内的任何内容,即使内部有菜单.

结果选择器(#root是主< ul>的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))

其他有趣的选择器

在寻找解决方案的同时,由于我对这个问题的误解,某些有趣的选择器出现了,但是我将把它们包括在内,只是为了记录,这可能会对某些人有所帮助.

猜你在找的jQuery相关文章