JavaScript

Не работает js.Ищу элемент а выдает ошибку

 document.getElementById("btn-pol").addEventListener("click", function() {
document.getElementsByClassName("popup").classList.add("open");
})
Uncaught TypeError: Cannot read properties of null (reading 'addEventListener')
Элемента не существует. Возможно, он ещё не загрузился, подключи скрипт в конце
ID
Inayat Djalali
6 773
Лучший ответ
2 вартанта:
  1. Элемент ещё не загрузился.
  2. Данного элемента в принципе не существует.
Скрипт затрагивающий DOM должен выполняться ПОСЛЕ загрузки DOM.
Константин Огородников я просто делал модальное окно и с js много не работал(только в майнкрафте) в верстке я его не принимал.И он не хочет находить или выполнять click
Ошибка "Cannot read properties of null (reading 'addEventListener')" указывает на то, что элемент с идентификатором btn-pol не был найден в DOM в момент выполнения кода. Есть несколько причин, по которым это может происходить:

Скрипт выполняется до того, как DOM полностью загрузится. В этом случае, элемент ещё не существует в момент выполнения кода. Чтобы решить эту проблему, вы можете поместить ваш скрипт перед закрывающим тегом </body> или использовать событие DOMContentLoaded:
 document.addEventListener("DOMContentLoaded", function() { 
document.getElementById("btn-pol").addEventListener("click", function() {
document.getElementsByClassName("popup")[0].classList.add("open");
});
});
Ошибка в идентификаторе элемента. Убедитесь, что идентификатор в HTML и в JavaScript совпадают и написаны правильно.

Также в вашем коде есть ещё одна потенциальная проблема: getElementsByClassName возвращает HTMLCollection, а не один элемент. У коллекции нет свойства classList, так что вам нужно выбрать конкретный элемент из коллекции, например так:
 document.getElementsByClassName("popup")[0].classList.add("open");  
Или, если вы хотите добавить класс всем элементам с классом popup, вы можете использовать цикл:
 var popups = document.getElementsByClassName("popup"); 
for (var i = 0; i < popups.length; i++) {
popups[i].classList.add("open");
}
Итак, полный код может выглядеть примерно так:
 document.addEventListener("DOMContentLoaded", function() { 
var btn = document.getElementById("btn-pol");
if (btn) {
btn.addEventListener("click", function() {
var popups = document.getElementsByClassName("popup");
for (var i = 0; i < popups.length; i++) {
popups[i].classList.add("open");
}
});
}
});
Юрий Тарасов
Юрий Тарасов
3 288