Форум

LocalVariable · #1 (**permalink**) 01.06.2023, 19:00

Всем привет!
Пытаюсь создать переменную i внутри <script></script>:

<!doctype html>
<script>
let i = document.getElementById("txt");
window.onload = init;
function init (){
	alert(i);
}
</script>
<body>
<p1 id="txt">Something</p1>
</body>

Выдает null. Если поместить строчку let i = document.getElementById("txt"); внутрь init(), то показывает правильно, что HTLMElement. Вместо let пытался использовать var, с тем же результатом. Как сделать так, чтобы переменная i инициализировалась правильно, ведь инициализация происходит перед window.onload?

рони · #2 (**permalink**) 01.06.2023, 19:37

LocalVariable,

<!doctype html>
<script>
let i;
window.onload = init;
function init (){
    i = document.getElementById("txt");
    alert(i);
}
</script>
<body>
<p1 id="txt">Something</p1>
</body>

voraa · #3 (**permalink**) 01.06.2023, 21:00

Или так

<!doctype html>
<body>
<p1 id="txt">Something</p1>
<script>
let i = document.getElementById("txt");
window.onload = init;
function init (){
    alert(i);
}
</script>
</body>

i = document.getElementById("txt");
должно выполнятся после того, как браузер обработает строчку
<p1 id="txt">Something</p1>

LocalVariable · #4 (**permalink**) 01.06.2023, 22:12

Спасибо большое!

LocalVariable · #5 (**permalink**) 02.06.2023, 01:10

Сообщение от voraa

i = document.getElementById("txt");
должно выполнятся после того, как браузер обработает строчку <p1 id="txt">Something</p1>
...

Но разве команда

window.onload

не означает, что "после того, как обработан код HTML до конца документа, вернуться к коду между <script>"?

voraa · #6 (**permalink**) 02.06.2023, 07:47

Нет. Браузер обрабатывает текст кода последовательно сверху вниз. Когда он встречает <script> то просто выполняет его, потом идет дальше и снова начинает парсить html

<!doctype html>
<script>
let i = document.getElementById("txt");
window.onload = init;
function init (){
    alert(i);
}
</script>
<body>
<p1 id="txt">Something</p1>
</body>

Сначала выполнится строка
3 let i = document.getElementById("txt");
Но строка
<p1 id="txt">Something</p1>
еще не разобрана, и элемент с id="txt" не может быть найден

LocalVariable · #7 (**permalink**) 02.06.2023, 12:21

Сообщение от voraa

Когда он встречает <script> то просто выполняет его, потом идет дальше и снова начинает парсить html

И только после завершения парсинга выполнится window.onload?

Aetae · #8 (**permalink**) 02.06.2023, 12:43

window.onload - выполнится когда вся страница загрузится. Т.е. не только завершение парсинга но и загрузка всех картинок и т.д.
Чтоб сработало чётко по завершении парсинга используется событие DOMContentLoaded.

LocalVariable · #9 (**permalink**) 02.06.2023, 13:12

Понял, всем спасибо!

Форум

Справочник

Discord чат

Курсы javascript