Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Проблема с .innerHTML (https://javascript.ru/forum/misc/72032-problema-s-innerhtml.html)

Konor 02.01.2018 11:08

Проблема с .innerHTML
 
Есть такой html код:
<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="script.js"></script>
</head>
<body>
    <div id="text">Text</div>
	
</body>
</html>


И JavaScript код:
var text = document.querySelector('#text');
	
text.onclick = function(){
	text.innerHTML = 'Some Content';
}


Пока пытаюсь понять основы. По идее при клике на блок #text должно поменяться содержимое блока. Но оно не меняется. Что не так?

Aetae 02.01.2018 11:24

F12 и смотрим в консоль, там всё написано.

По факту проблема в том, что скрипт выполняется сразу там, где его вызвали, по мере разбора документа. Потому, на момент вызова, никакого <div id="text"> ещё не существует. Решение: разместить <script> внизу страницы либо использовать событие загрузки документа.

Konor 02.01.2018 11:29

Я хочу от тебя детей! Спасибо, уже второй день себе мОзги насилую в попытках понять, а в видеоуроках такой нюанс никто не раскрывает, как минимум троих авторов смотрел.


Часовой пояс GMT +3, время: 07:42.