Вопрос

Я пытаюсь настроить селектор jQuery, но не совсем понимаю, как мне его написать.

У меня есть неупорядоченный список, который выглядит примерно так:

<ul>
    <li>something</li>
    <li>something</li>
    <li>something</li>
    <li>something</li>
    <li class="last">something</li>
</ul>

Теперь я знаю, хочу ли я выбрать последнего дочернего элемента, я могу сделать это, используя «ul li.last» или «ul.li:last», но скажем, хочу ли я второго от последнего, третьего или 20-го?Сделал бы я это сейчас?

Это было полезно?

Решение

Ты используешь eq:

$('ul li').eq(X);

Где X — это индекс нужного элемента, начинающийся с 0.Вы также можете использовать форма выбора:

$('ul li:eq(X)');

И вы также можете добиться аналогичного результата, используя nth-child:

$('ul li:nth-child(X)');

В документации говорится о разнице между nth-child и eq:

Хотя :eq(index) соответствует только одному элементу, он соответствует более чем одному:По одному для каждого родителя с индексом.Множественно для каждого родителя с четным, нечетным или уравнением.Указанный индекс имеет один индекс, в отличие от :eq(), который начинается с нуля.

Итак, делая $('ul li').eq(19); вы получите единственный 20-й соответствующий элемент запроса (поэтому, если в документе более одного списка, вы не получите «все 19-е дочерние элементы», в то время как $('ul li:nth-child(20)'); предоставит вам отдельный 20-й соответствующий элемент списка для каждого <ul> в документе.

РЕДАКТИРОВАТЬ:

Чтобы сделать что-то вроде «предпоследнего», разумный способ сделать это будет выглядеть так:

var $ul = $('#mylist > li');
var $el = $ul.eq($ul.length-2);

Но вам, вероятно, следует проверить, чтобы убедиться, что length-2 не меньше 0.

Другие советы

Хочешь третий из последних?

var $ul = $("ul li");
$ul.find(":eq(" + Math.max(0, $ul.length - 3) + ")");

Краткое объяснение: длина $ ul (который является объектом jQuery) - это количество найденных li. Таким образом, вы можете использовать это вместе с & Quot;: eq (n) & Quot; селектор, чтобы получить li по нужному индексу.

Я использовал Math.max на случай, если список был слишком коротким (менее 3 литов).

Это тоже будет работать, но это явно не лучший способ:

var $ul = $("ul li:last").prev().prev();

Для третьего и двадцатого вы можете использовать ul li: eq (3) и ul li: eq (20) . От второго до последнего вы можете что-нибудь сделать с nth-child < Параметр аргумента уравнение / a>, хотя я не уверен.

alert($('ul li').eq(3).text());

Это предупредит текст третьего элемента списка.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top