Ошибка “Cannot set property of NULL”

330

24 апреля 2017, 04:15

До сегодняшнего дня ни разу не писал на чистом javascript'e. Но вот приспичило. У сразу же схлопотал ошибку, а что не так - не пойму.

Есть один файл (index.html):

<!DOCTYPE html>
 <html>
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <meta charset="utf-8" />
  <script src="script.js"></script>
 </head>
 <body>
  <div id="qwer">11</div>
 </body>
</html>

И второй файл (script.js):

(function () { 
document.getElementById("qwer").innerHTML='44';
})();

В общем скрипт не работает, отладчик пишет "uncaught typeerror: cannot set property of null" Что же не так? Ведь элемент с id "qwer" существует.

Answer 1

В момент исполнения скрипта, документ еще не загрузился до конца.

Первый вариант. Вам нужно сделать аналог jquery метода $(document).ready(). Например, вызывать свой метод внутри window.onload = function(){}; Учтите, что таким образом функцию на событие можно навесить только один раз. Если мало - нужно сделать свой кроссбраузерный аналог jquery метода bind.

Есть второй вариант. Переместить вызов скрипта в самый низ документа.

Answer 2

(function () { 
window.onload = function {
document.getElementById("qwer").innerHTML='44';
}
})();

Answer 3

Можно поставить в тег script defer)

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Динамическое обновление data в vue.js

Есть плата Arduino с датчиком температуры, которая через IoT PubNub при изменении температуры отправляет данныеСкрипт записывает данные с датчика...

344

javascript

Галерея фотографий

Для вывода галереи использую следующий код: Разметка:

279

javascript

Вывод AJAX'ом из выпадающего списка на экран

Поставил такую задачу:

263

javascript

Не работает функция в Opera

Подскажите, почему не работает эта функция в Opera и как исправитьХочу, при изменении ширины экрана показывать разные блоки, работает везде,...

315