Ошибка получения элементов в JavaScript
Иногда начинающие программисты совершают ошибку,
используя для получения группы DOM элементов
метод querySelector
вместо метода
querySelectorAll
.
Давайте посмотрим на характерные особенности данной ошибки. Пусть даны абзацы:
<p>1</p>
<p>2</p>
<p>3</p>
Некий программист решил получить и вывести в консоль тексты этих абзацев. Для этого он получил ссылки на эти элементы в переменную, ошибочно использовав не тот метод:
let elems = document.querySelector('p');
Затем он решил перебрать абзацы циклом и вывести текст каждого абзаца в консоль:
for (let elem of elems) {
console.log(elem.textContent);
}
В результате в консоли появится характерная
ошибка elems is not iterable. Она говорит,
что переменная elems
не итерабельна,
то есть не является массивом или чем-то,
что можно перебрать через цикл for-of
.