Errore nell'ottenere elementi in JavaScript

A volte i programmatori principianti commettono l'errore di utilizzare per ottenere un gruppo di elementi DOM il metodo querySelector invece del metodo querySelectorAll.

Diamo un'occhiata alle caratteristiche tipiche di questo errore. Supponiamo di avere i seguenti paragrafi:

<p>1</p>
<p>2</p>
<p>3</p>

Un programmatore ha deciso di ottenere e stampare in console i testi di questi paragrafi. Per fare ciò, ha messo i riferimenti a questi elementi in una variabile, utilizzando erroneamente il metodo sbagliato:

let elems = document.querySelector('p');

Poi ha deciso di scorrere i paragrafi con un ciclo e stampare il testo di ogni paragrafo in console:

for (let elem of elems) {
	console.log(elem.textContent);
}

Di conseguenza, in console apparirà il caratteristico errore elems is not iterable. Questo indica che la variabile elems non è iterabile, cioè non è un array o qualcosa che può essere iterato con il ciclo for-of.