Селектор jQuery нелогичен
3 Strontium_99 [2012-01-11 12:38:00]
У меня возникла проблема с выбором определенного элемента li в неупорядоченном списке. Хотя это не серьезная проблема, и я могу найти способ обойти ее, мне бы очень хотелось узнать, почему она не работает.
Мой HTML:
<div id="myList">
<ul>
<li>something 1</li>
<li>something 2</li>
<li>something 3</li>
<li>something 4
<ul>
<li>sub something 1</li>
<li>sub something 2</li>
<li>sub something 3</li>
</ul>
</li>
</ul>
</div>
Моя проблема такова:
$('#myList ul:first li:first').addClass('cool')
Это добавляет класс к тегу li-1. Все хорошо и хорошо. Но:
$('#myList ul:first li:last').addClass('cool')
Вместо добавления класса в тег "something 4" li он добавляет его в тег "sub something 3" li.
Почему?
jquery jquery-selectors
2 ответа
6 Решение bardiir [2012-01-11 12:40:00]
Вы выбираете все li-теги по дереву.
Возможно, вы захотите попробовать следующее:
$('#myList ul:first>li:last').addClass('cool')
Таким образом вы выбираете только прямые дочерние узлы предыдущего node.
3 lonesomeday [2012-01-11 12:43:00]
li:last обрабатывается слева направо. Сначала выбираются все элементы li, которые являются потомками ul. Поскольку вы используете селектор потомков, а не дочерний селектор, это включает в себя все элементы "sub" li. :last затем выбирает последний из них для отображения в документе, который находится sub something 3.
Вместо этого используйте дочерний селектор:
$('#myList ul:first > li:last').addClass('cool')