Javascript выполняется в порядке сверху вниз, если не указано иное, код Javascript не будет ждать загрузки страницы перед выполнением. Например, веб-страница содержит следующий HTML-код:
Скопируйте код кода следующим образом:
<div id="ele">Добро пожаловать на www.VeVB.COM</div>
Если вы добавите следующий код Javascript перед этой строкой HTML-кода:
Скопируйте код кода следующим образом:
<тип сценария="текст/javascript">
document.getElementById('ele').innerHTML= 'добро пожаловать в мой блог';
</скрипт>
Запустите страницу, и вы получите сообщение об ошибке: «document.getElementById('ele') имеет значение null». Причина в том, что при запуске приведенного выше javascript на странице нет элемента DOM с идентификатором «ele».
Есть два решения:
1. Поместите код JavaScript после кода HTML:
Скопируйте код кода следующим образом:
<div id="ele">Добро пожаловать на www.VeVB.COM</div>
<тип сценария="текст/javascript">
document.getElementById('ele').innerHTML='добро пожаловать в мой блог';
</скрипт>
2. Подождите, пока загрузится веб-страница, а затем запустите код JavaScript. Вы можете использовать традиционное решение (загрузку): сначала добавьте тело HTML и добавьте «<body load="load()">», а затем вызовите приведенный выше код JavaScript в функции load(). Здесь я хочу сосредоточиться на использовании jQuery для достижения:
Скопируйте код кода следующим образом:
<скрипт>
$(документ).ready(функция(){
document.getElementById('ele').innerHTML= 'добро пожаловать в мой блог';
});
</скрипт>
//Конечно, поскольку используется jQuery, его написать проще:
<скрипт>
$(документ).ready(функция(){
$('#ele').html('добро пожаловать в мой блог'); //Метод .text() также доступен здесь.
});
</скрипт>
Вы можете разместить приведенный выше код jQuery в любом месте страницы, и он всегда будет ждать загрузки страницы перед выполнением.