document.getElementById("btn-pol").addEventListener("click", function() {
document.getElementsByClassName("popup").classList.add("open");
})
Uncaught TypeError: Cannot read properties of null (reading 'addEventListener')
JavaScript
Не работает js.Ищу элемент а выдает ошибку
Элемента не существует. Возможно, он ещё не загрузился, подключи скрипт в конце
2 вартанта:
- Элемент ещё не загрузился.
- Данного элемента в принципе не существует.
Константин Огородников
я просто делал модальное окно и с js много не работал(только в майнкрафте) в верстке я его не принимал.И он не хочет находить или выполнять click
Ошибка "Cannot read properties of null (reading 'addEventListener')" указывает на то, что элемент с идентификатором btn-pol не был найден в DOM в момент выполнения кода. Есть несколько причин, по которым это может происходить:
Скрипт выполняется до того, как DOM полностью загрузится. В этом случае, элемент ещё не существует в момент выполнения кода. Чтобы решить эту проблему, вы можете поместить ваш скрипт перед закрывающим тегом </body> или использовать событие DOMContentLoaded:
Также в вашем коде есть ещё одна потенциальная проблема: getElementsByClassName возвращает HTMLCollection, а не один элемент. У коллекции нет свойства classList, так что вам нужно выбрать конкретный элемент из коллекции, например так:
Скрипт выполняется до того, как 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");
}
});
}
});
Похожие вопросы
- Проверьте 2 кода ((( пожалуйста и ткните носом на ошибку. В общем 1 код работает частично, а второй вообще не работает. JS
- Почему консоль выдает ошибку в callback ф-ии?
- Можно ли отловить событие когда один элемент попадает на другой в js?
- Почему в JS нет низкоуровневых ошибок (предупреждений)?
- Вопрос только к тем, кто знает js: Кому не лень, объясните мне нубу значение каждого элемента небольшого кода (10 строк).
- Помогите определиться с выбором нового языка (JS(TS) vs Java)
- Js фреймворки, что полезного можно для себя найти?
- В чем цель фреймворков js web?
- [HTML/CSS/JS] Как сохранять изменённые в .js данные оффлайн-сервера локально?
- Почему jQuery методы популярнее js методов при общении с ДоМ?