getElementById находитэто выше этого, но не ниже этого - PullRequest
Новая
       6

getElementById находитэто выше этого, но не ниже этого

0 голосов
/ 05 февраля 2011

Я никогда не читал курсы по кодированию Javascript и не читал об этом книги.Никогда не было сильной потребности.Но я только что заметил самую странную проблему, которая может объяснить многие из моих трудностей с JS за эти годы.

Это работает в FF 3.6: 

<html><body><div id="foo"></div>
<script> var x=document.getElementById("foo").innerHTML="OK"; </script>

Но, как ни странно, это не работает в FF3.6: 

<html><body>
<script> var x=document.getElementById("foo").innerHTML="OK"; </script>
<div id="foo"></div>

Другими словами, код Javascript, о котором мне всегда говорили, должен располагаться выше в файле и предпочтительно в заголовке, не может видеть элементы HTML, встречающиеся под ним в файле.

Несмотря на то, что мой тест дал четкие результаты, я хочу спросить: я прав насчет этого правила (которое я никогда не видел ранее) или это просто ошибка FF?

Спасибо.

Ответы [ 4 ]

4 голосов
/ 05 февраля 2011

JavaScript может исполниться до того, как браузер на самом деле построит DOM-дерево с тегом div.

Чтобы JavaScript действительно находил элемент, обязательно используйте функцию onReady. 

window.onload = function() {
  document.getElementById("foo").innerHTML="OK";
}

С вашим первым фрагментом кода div находится перед JS, поэтому браузер, вероятно, создаст дерево DOM, прежде чем он фактически выполнит JS (хотя это не гарантировано, но, вероятно, он всегда будет работать для вас).

В своем втором фрагменте вы помещаете div за тегом script, таким образом, JS выполняется первым, когда дерево DOM вообще не включает в себя элемент div.

0 голосов
/ 05 февраля 2011

Или, альтернативно, поместите свой JavaScript-код в конец страницы непосредственно перед тегом </body>, и он найдет элемент в порядке:)

0 голосов
/ 05 февраля 2011

Это потому, что он выполняется в том порядке, в котором он анализируется ..

Вам необходимо выполнить это после загрузки всего DOM.

Для этого .. 

window.onload = function() {
   // do your stuff here
};
0 голосов
/ 05 февраля 2011

Код Javascript не может видеть элементы HTML, встречающиеся под ним в файле.

JavaScript выполняется во время синтаксического анализа.Если вы не задержите выполнение (назначив функцию в качестве обработчика события), искомый элемент просто не будет существовать при запуске сценария.Это ожидаемое поведение.

, о котором мне всегда говорили, должно быть выше в файле и желательно в заголовке,

В общем, вам не следуетt загружать JavaScript, если только перед ним действительно не нужно запустить .Он блокирует синтаксический анализ, поэтому задерживает рендеринг страницы во время загрузки и запуска.Во многих случаях элемент <script> должен появляться непосредственно перед тегом </body>.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...