Индекс элемента в наборе

.index()

Возвращяет индекс заданного элемента в наборе (2 и 3 вариант использования) или относительно соседних элементов (1 вариант использования). Метод имеет следующие варианты использования:

.index()
возвращяет номер позиции первого выбранного элемента, относительно соседних элементов на странице (под соседними понимаются элементы, которые имеют общего родителя).
.index(selector)
возвращяет номер позиции первого выбранного элемента, среди элементов, удовлетворяющих селектору selector. Если такого элемента там не найдется, то метод вернет -1
.index(element)
возвращяет номер позиции элемента element, в наборе выбранных элементов. Параметр element может быть представлен DOM-элементом или объектом jQuery (если он будет содержать несколько элементов, то метод будет выполнен для первого из них).

Примеры

Рассмотрим следующий html-текст:

<ul>
  <li id="foo">foo</li>
  <li id="bar">bar</li>
  <li id="baz">baz</li>
</ul>

следующие два абзаца кода будут делать одно и то же:

var listItem = document.getElementById('bar');
alert('Index: ' + $('li').index(listItem));
 
var listItem = $('#bar');
alert('Index: ' + $('li').index(listItem));

в результате, на экран будет два раза выведено: "Index: 1". Это же, будет выведено на экран и в следующем случае:

alert('Index: ' + $('#bar').index("li"));

таким образом видно, что второй и третий вариант использования метода index() отличаются порядком следования элемента поиска и области поиска.

Все тот же результат мы получим, используя первый вариант метода index():
alert('Index: ' + $('#bar').index());

В данном случае, jQuery будет искать элемент с идентификатором bar, среди соседних элементов, которыми в нашем случае являются элементы li.

Ссылки

Поисковые ключи:
  • номер элемента в наборе
  • индекс элемента в наборе
  • позиция элемента в наборе
  • .index()
  • index()