jQuery - eq (метод)
Статья, в которой рассматривается метод библиотеки jQuery .eq()
.
Назначение метода .eq()
Метод .eq(index)
предназначен для выбора элемента с указанным индексом из текущего набора. Отсчёт элементов в наборе ведётся с нуля. Значение индекса (index
) можно задавать как с помощью положительного числа (отсчёт элемента ведётся с начала), так и с помощью отрицательного числа (отсчёт элемента ведётся с конца). В качестве результата данный метод возвращает объект jQuery, который может состоять либо из одного элемента (если элемент с указанным индексом существует), либо оставаться пустым (если элемент с указанным индексом не существует).
Примеры использования метода .eq()
Работу с методом .eq()
рассмотрим на следующих примерах:
-
Создадим список
ul
, состоящий из 5 элементовli
.<ul id="myList"> <li>1 пункт</li> <li>2 пункт</li> <li>3 пункт</li> <li>4 пункт</li> <li>5 пункт</li> </ul>
Выберем все элементы
li
, находящиеся в элементеul
сid="myList"
.// переменная, хранящая ссылку на объект jQuery, который содержит выбранные в соответствии с селектором элементы (первоначальная выборка) var elements = $("ul#myList > li"); // --> в качестве результата получим объект jQuery, содержащий своём наборе 5 элементов.
-
Выберем из первоначальной выборки элемент, который имеет индекс 2.
var element3 = elements.eq(2); //или без использования переменной elements $("ul#myList > li").eq(2); // --> в качестве результата получим объект jQuery, содержащий в своём наборе элемент <li>3 пункт</li>.
-
Выберем из первоначальной выборки предпоследний элемент.
var element3 = elements.eq(-2); //или без использования переменной elements $("ul#myList > li").eq(-2); // --> в качестве результата получим объект jQuery, содержащий в своём наборе элемент <li>4 пункт</li>.
-
Выберем из первоначальной выборки элемент, который имеет индекс 5.
var element5 = elements.eq(5); //или без использования переменной elements $("ul#myList > li").eq(5); // --> в качестве результата получим объект jQuery, не содержащий в своём наборе элементы.
-
Вывести сообщение в консоль о том содержит ли объект jQuery элемент с индексом 3 или нет.
if ($("ul#myList > li").eq(3).length == 1) { console.log("Набор содержит элемент с индексом 3"); } else { console.log("Набор не содержит элемент с индексом 3"); } // --> в качестве результата увидим в консоли сообщение: Набор содержит элемент с индексом 3.
-
Вывести сообщение в консоль о том, содержит ли объект jQuery элемент с индексом 5 или нет.
if ($("ul#myList > li").eq(5).length == 1) { console.log("Набор содержит элемент с индексом 5"); } else { console.log("Набор не содержит элемент с индексом 5"); } // --> в качестве результата увидим в консоли сообщение: Набор не содержит элемент с индексом 5.
Комментарии ()