Элемент IndexOf в массиве

Question

Я пытаюсь получить индекс из массива элементов.

var arr = document.getElementsByClassName('class'); //3 elements 

console.log(arr); 
output// [div.class.selected, div.class, div.class, item: function, namedItem: function] 

var selected = document.getElementsByClassName('selected'); 
var selected_id = arr.indexOf(selected[0]); 

Последняя строка кода дает мне ошибку Uncaught TypeError: undefined is not a function. Я также попытался добавить toString() и искать, но та же ошибка.

Answer 1

Это потому, что arr является (живым) NodeList не массивом; что вы хотите, я думаю:

console.log([].indexOf.call(arr, selected[0])); 

var arr = document.getElementsByClassName('class'); 
 
var selected = document.getElementsByClassName('selected'); 
 
var selected_id = [].indexOf.call(arr, selected[0]); 
 
console.log(selected_id);

<div class="class"></div><div class="class"></div><div class="class selected"></div><div class="class"></div>

Линия:

var selected_id = [].indexOf.call(arr, selected[0]); 

Использует родной Array.prototype.indexOf() метод, поставляя arr как this (в основном с помощью arr как массив, на который вызывается метод), поставляя selected[0] в качестве аргумента передается методу, поэтому рода будет применяться, как вы назвали его сами:

var selected_id = arr.indexOf(selected[0]); 

но делает это таким образом, что распознает метод indexOf() не доступен для NodeList объект (вызывающий его законным способом и, следовательно, предотвращающий ошибку).

Ссылки:

• Array.prototype.indexOf().
• document.getElementsByClassName().
• Function.prototype.call().

Answer 2

getElementsByClassName не возвращает массив, но HTMLCollection. Таким образом, он не имеет методов массива, таких как indexOf. Вы должны явно вызывать методы массива с this значением HTMLCollection, как это:

var selected_id = Array.prototype.indexOf.call(arr, selected[0]); 

Answer 3

Это потому, что document.getElementsByClassName('class') не возвращает Array, но NodeList, который представляет собой массив типа объекта. Вы можете превратить массивный объект в массив, используя:

var elements = document.getElementsByClassName('class'); 
var arr = Array.prototype.slice.call(elements);