Błąd dostępu do tablicy elementów w JavaScript
Czasami początkujący programiści próbują pracować z tablicą elementów tak, jakby mieli jeden element. Przyjrzyjmy się, na czym polega ten błąd.
Załóżmy, że mamy paragrafy:
<p>1</p>
<p>2</p>
<p>3</p>
Załóżmy, że jakiś programista postanowił zapisać w tekście każdego paragrafu tę samą wartość. Aby to zrobić, pobrał referencje do tych elementów do zmiennej:
let elems = document.querySelectorAll('p');
Następnie nasz programista błędnie odwołał się do naszej zmiennej tak, jakby zawierała jeden element, a nie tablicę. W rezultacie tekst paragrafów nie zmieni się, ale, co charakterystyczne, nie będzie też błędu w konsoli:
elems.textContent = '!';
Prawidłowym rozwiązaniem będzie tutaj przejście przez tablicę elementów pętlą i dla każdego elementu z osobna wykonanie wymaganej operacji:
for (let elem of elems) {
elem.textContent = '!';
}