JQuery: только прямой селектор потомков - PullRequest
9 голосов
/ 20 мая 2011

У меня следующая структура:

<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> (дочерние элементы), но не те, которые попадают под другие теги (внуки), если яdo

$('ul li> a')

Я также получу ul, который вложен в div.Есть ли «чистый» способ сделать это?спасибо

ps: я хотел бы иметь универсальный селектор (это для плагина меню, поэтому я хочу, чтобы он игнорировал все теги привязки, которые не попадают непосредственно в поток меню)

Ответы [ 3 ]

13 голосов
/ 20 мая 2011

Окончательное решение

Этот ответ был полностью отредактирован для обновления. Окончательное решение - это, в основном, селектор, в котором, начиная с идентификатора исходного элемента <ul>, выбираются все якоря в элементах списка, которые не нарушают структуру структуры меню. То есть, если есть элемент, отличный от <ul> или <li>, вложенный в него, не выбирайте ничего внутри этих элементов, даже если в нем есть меню.

Результирующий селектор (#root - это идентификатор основного <ul>):

$('#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/

0 голосов
/ 20 мая 2011

Благодаря большому вкладу @DarthJDG

это решение

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

this.content - объект, на который ссылается плагин, в этом случае объект является родительским UL

.

Надеюсь, это кому-нибудь поможет

0 голосов
/ 20 мая 2011

Я думаю, что вы ищете:

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

Это даст вам все li>a без div или что-то в этом.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...