Метод .index()

Определение и применение

Метод .index() определяет позицию DOM-элемента. Его используют, например, чтобы сопоставить нажатую вкладку с панелью. Область поиска зависит от аргумента: соседи, текущая коллекция или набор по селектору.

Синтаксис

JavaScript

collection.index();
collection.index(element);
collection.index(jQueryObject);
collection.index(selector);

Параметры и возвращаемое значение

Без аргумента возвращается индекс первого элемента среди дочерних элементов его родителя. Текстовые узлы и комментарии не учитываются. Пустой набор или элемент без родителя даёт -1.

При передаче DOM-элемента метод ищет его в текущей коллекции. Если передан объект jQuery, берётся только его первый элемент. Аргумент-строка меняет направление: метод ищет первый элемент текущей коллекции в наборе, выбранном этой строкой.

Результат — целое число с нуля; -1 означает отсутствие элемента. Не проверяйте результат просто через if (index): ноль — корректная первая позиция, а -1 приводится к true. Используйте index >= 0.

Особенности и совместимость

Метод не переставляет элементы. Позиция в отфильтрованной коллекции может отличаться от позиции среди соседей. Для получения элемента по индексу предназначены .get() и .eq().

Документация

index — jQuery API

Пример использования

Три области поиска: попробуйте сами

Элемент Б второй среди соседей, первый в выбранном подмножестве и второй среди всех li. Индексы: 1, 0, 1. Используется jQuery 4.0.0.

index.html

HTML

<ul>
  <li>А</li>
  <li id="chosen">Б</li>
  <li>В</li>
</ul>
<pre id="result"></pre>

main.js

JavaScript

const selected = $('#chosen')
const subset = $('li').slice(1)
$('#result').text([selected.index(), subset.index(selected), selected.index('li')].join(', '))