jQuery - eq (метод)

Статья, в которой рассматривается метод библиотеки jQuery .eq().

Метод .eq(index) предназначен для выбора элемента с указанным индексом из текущего набора. Отсчёт элементов в наборе ведётся с нуля. Значение индекса (index) можно задавать как с помощью положительного числа (отсчёт элемента ведётся с начала), так и с помощью отрицательного числа (отсчёт элемента ведётся с конца). В качестве результата данный метод возвращает объект jQuery, который может состоять либо из одного элемента (если элемент с указанным индексом существует), либо оставаться пустым (если элемент с указанным индексом не существует).

jQuery - Метод eq()

Работу с методом .eq() рассмотрим на следующих примерах:

  1. Создадим список ul, состоящий из 5 элементов li.

    <ul id="myList">
      <li>1 пункт</li>
      <li>2 пункт</li>
      <li>3 пункт</li>
      <li>4 пункт</li>
      <li>5 пункт</li>
    </ul>
    
  2. Выберем все элементы li, находящиеся в элементе ul с id="myList".

    // переменная, хранящая ссылку на объект jQuery, который содержит выбранные в соответствии с селектором элементы (первоначальная выборка)
    var elements = $("ul#myList > li");
    // --> в качестве результата получим объект jQuery, содержащий своём наборе 5 элементов.
    
  3. Выберем из первоначальной выборки элемент, который имеет индекс 2.

    var element3 = elements.eq(2);
    //или без использования переменной elements
    $("ul#myList > li").eq(2);
    // --> в качестве результата получим объект jQuery, содержащий в своём наборе элемент <li>3 пункт</li>.
    
  4. Выберем из первоначальной выборки предпоследний элемент.

    var element3 = elements.eq(-2);
    //или без использования переменной elements
    $("ul#myList > li").eq(-2);
    // --> в качестве результата получим объект jQuery, содержащий в своём наборе элемент <li>4 пункт</li>.
    
  5. Выберем из первоначальной выборки элемент, который имеет индекс 5.

    var element5 = elements.eq(5);
    //или без использования переменной elements
    $("ul#myList > li").eq(5);
    // --> в качестве результата получим объект jQuery, не содержащий в своём наборе элементы.
    
  6. Вывести сообщение в консоль о том содержит ли объект jQuery элемент с индексом 3 или нет.

    if ($("ul#myList > li").eq(3).length == 1) {
      console.log("Набор содержит элемент с индексом 3");
    }
    else {
      console.log("Набор не содержит элемент с индексом 3");
    }
    // --> в качестве результата увидим в консоли сообщение: Набор содержит элемент с индексом 3.
    
  7. Вывести сообщение в консоль о том, содержит ли объект jQuery элемент с индексом 5 или нет.

    if ($("ul#myList > li").eq(5).length == 1) {
      console.log("Набор содержит элемент с индексом 5");
    }
    else {
      console.log("Набор не содержит элемент с индексом 5");
    }
    // --> в качестве результата увидим в консоли сообщение: Набор не содержит элемент с индексом 5.
    


   JavaScript и jQuery 0    857 0

Комментарии (0)

    Вы должны авторизоваться, чтобы оставлять комментарии.