Зачем нужен [0] в коде JavaScript?

   <span class="close">&times;</span> <!--Кнопка закрывания -->


var close = document.getElementsByClassName("close")[0];
close.onclick = function() {
  modal.style.display = "none";//закрытие 
}

Объясните пожалуйста, почему без [0] не работает кнопка закрывания, разве он не означает выбор первого элемента из коллекции c классом close в данном случае? Да и вообще,если я не правильно написал,подправьте.


Ответы (2 шт):

Автор решения: Алексей Шиманский

Без [0] не работает потому, что выбирается коллекция. А у коллекции не будет метода onclick. Поэтому нужно обращаться к каждому элементу коллекции и вешать на него событие

Если на странице будет всегда только одно окно и одна кнопка закрытия, то проще использовать id и поиск по нему (например getElementById), чтобы все эти [0] не смущали ни вас, ни других разработчиков

→ Ссылка
Автор решения: Владислав Перевышко

getElementsByClassName возвращает коллекцию из элементов. У коллекции нет события onclick. Если вы хотите навесить событие только на первый элемент - используйте индекс [0], но проверьте, что это ваш единственный элемент с таким классом. Если хотите навесить хендлер на все элементы с таким классом - надо будет использовать цикл

→ Ссылка