Селектор jquery - выбор родителей, но не детей

Я пытаюсь использовать jquery для выбора элемента и добавления класса к этому элементу. Мой html похож на следующий:

<ul id="top">
    <li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-ancestor current-menu-parent current_page_parent current_page_ancestor">
    <a href="#">Corporate</a>
        <ul class="sub-menu">
            <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-11">
                <a href="#">Press</a>
            </li>
            <li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-88 current_page_item menu-item-90">
                <a href="#">Press</a>
            </li>
        </ul>
    </li>
    <li><a href="#"></a></li>
    <li><a href="#"></a></li>
    <li><a href="#"></a></li>
    <li><a href="#"></a>
         <ul class="sub-menu"><li><a href="#">Link</a></li></ul>
    </li>
</ul>

Я хотел бы добавить класс «стрелка» к каждой якорной ссылке, которая является прямым дочерним элементом элементов <li> первого уровня. Другими словами, я хотел бы, чтобы «корпоративная» ссылка имела класс «стрелка», но ни одна из якорных ссылок в .submenu не имела этого класса. Я пробовал следующий jquery ($("li.current_page_ancestor a:nth-child(1)").addClass("arrow");), но он добавляет класс к каждой якорной ссылке, что имеет смысл. Как просто добавить этот класс к якорным ссылкам, которые являются прямым потомком элементов списка верхнего уровня?


person JCHASE11    schedule 01.09.2011    source источник


Ответы (2)


> — дочерний селектор:

$('li.current_page_ancestor > a').
  add($('.sub-menu').parent().children('a')).
    addClass('arrow');
person Paul    schedule 01.09.2011
comment
это сработало хорошо. Я также хочу добавить класс стрелок ко всем якорным ссылкам, которые находятся внутри родителя .sub-menu. Я только что обновил приведенный выше пример. В этом примере я хотел бы добавить класс стрелки к абсолютной последней якорной ссылке в моем коде (той, что прямо над подменю) - person JCHASE11; 01.09.2011
comment
Как вам якорь над меню суммы? Он внутри него :-/ - person Alxandr; 01.09.2011
comment
@JCHASE Я обновил свой пост, чтобы отразить изменение в вашем вопросе. - person Paul; 01.09.2011
comment
это навигационная ссылка, на которую вы наводите курсор, чтобы открыть подменю. См. демонстрацию здесь: cruisinc.eu/management. подменю - person JCHASE11; 01.09.2011
comment
не вижу разницы в вашем посте!! Он отлично работает для всех текущих страниц, но для навигационных ссылок, которые не являются текущими, а также имеют набор дочерних элементов (подменю), он не работает! - person JCHASE11; 01.09.2011
comment
глупо добавлять подменю. Он уже создан WordPress. Знаешь что я имею ввиду? - person JCHASE11; 01.09.2011

Нравится?

$('ul#top > li > a').addClass('arrow')

CSS-селектор «>» означает «прямой потомок» или «прямой потомок».

person Alxandr    schedule 01.09.2011
comment
Вы уверены, что не только ваш css все портит? - person Alxandr; 01.09.2011
comment
вы правы, спасибо! Я также пытаюсь добавить еще один класс, см. мой текст в комментарии выше. - person JCHASE11; 01.09.2011