Почему Uncaught TypeError: Cannot set property 'onclick' of nul?

Есть страница. К ней подключены стили и скрипты
<script src='/js/jquery-3.5.1.min.js'></script>
<script src='/js/chat-main.js'></script>
<script src='/js/chat-cosmetics.js' defer></script>


В скрипте я получаю некий элемент chat-hello-message через
var chat_hello_message = document.getElementById('chat-hello-message');
, chat-hello-message выводится через js в этом же скрипте.

Сам вывод блока:
function chatHelloMessage() {
  var audio = new Audio();
  var body = document.getElementById('body');
  audio.src = '/audio/chat-new-message.mp3';
  audio.autoplay = true;
  body.innerHTML += "<div class='chat-hello-message-box' id='chat-hello-message-box'><p class='chat-hello-message chat-message' id='chat-hello-message'>Здравствуйте! Вам нужна помощь? Мы всегда рядом! Просто нажмите на кнопку в правом нижнем углу, чтобы задать вопрос.</p></div>";
}


Далее я через
chat_hello_message.onclick = function () {
  chat_hello_message.style.display = 'none';
  setTimeout(function () {
    chat_hello_message.innerHTML = "";
  }, 2000);
}
скрываю блок при клике по нему, а потом через 2 секунды очищаю содержимое блока. В итоге я получаю
Uncaught TypeError: Cannot set property 'onclick' of nul
(не null, а nul).

Кстати, при alt + click в VS code скрипты открываются из HTML.

Вопрос 1: В чём может быть проблема?
Вопрос 2: в чём отличия nul и null? Литература? В поисковике я, что забавно, ничего не нашёл.

UPD 12.07.2020: Ошибка
chat-cosmetics.js:7 
Uncaught TypeError: Cannot set property 'onclick' of null

осталась, +
chat-main.js:11 
Uncaught TypeError: Cannot read property 'addEventListener' of null
.

Проверил всё ЕЩЁ раз, нигде не пропущены буквы. Всё в порядке. проверял через поиск. В коде, который работал на JS fiddle браузер улетает с ошибкой. Уж не знаю как это.
  • Вопрос задан
  • 56 просмотров
Решения вопроса 2
notiv-nt
@notiv-nt
Как ваше ничего? Да, моё тоже
вы явно где-то потеряли вторую l
document.getElementById('chat-hello-message') вернуло null, значит на момент вызова функции, элемента ещё нет в DOm
Ответ написан
KickeRocK
@KickeRocK
FrontFinish
Смотрите, никаких ошибок и всё работает?
Uncaught TypeError: Cannot set property 'onclick' of nul

Вы где-то потратили одну конечную "l".
Браузерный компилятор сказал вам, что в контексте попытки присваивания onclick'a нет переменной chat_hello_message.
Может, вы где-то "замкнули" область видимости, внутри которой определена эта самая chat_hello_message
Вот так попробуйте
document.getElementById('chat-hello-message').onclick = function () {
  chat_hello_message.style.display = 'none';
  setTimeout(function () {
    chat_hello_message.innerHTML = "";
  }, 2000);
}

С этим кодом будет ошибка, либо такая же, либо на строке со стилем ниже
Если идентичная ошибка, значит при навешивании, этого блока еще не существует в DOM
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы