querySelectorAll не работает с forEach или map — почему и как обойти?
Беру все элементы через document.querySelectorAll('.item') и хочу пройтись циклом. forEach вроде работает, а map/filter ругаются, что это не функция. Это же массив?
4 ответа
querySelectorAll возвращает не массив, а NodeList — похожий на массив объект. У NodeList есть forEach (поэтому он и работает), но НЕТ map, filter, reduce и прочих методов массива.
Если нужны эти методы — сначала преврати NodeList в настоящий массив:
const items = document.querySelectorAll('.item');
// вариант 1: спред
const arr = [...items];
// вариант 2: Array.from
const arr2 = Array.from(items);
arr.map(el => el.textContent); // теперь работает
Кстати, getElementsByClassName возвращает HTMLCollection — у него нет даже forEach, так что там превращение в массив обязательно.
Это NodeList, а не массив. forEach у него есть, остального нет. Оберни в Array.from(...) или [...] и получишь все методы массива.
[...document.querySelectorAll('.item')].map(...).
Используй обычный for по индексу: for (let i = 0; i < list.length; i++) — NodeList же индексируется как массив.
