window.onload запускается до загрузки DOM (JavaScript)

У меня возникают проблемы с событиями window.onload и document.onload. Все, что я прочитал, говорит мне, что они не будут запускаться, пока DOM не будет полностью загружен всеми его ресурсами. Мне кажется, что это не происходит для меня:window.onload запускается до загрузки DOM (JavaScript)

Я пробовал следующую простую страницу в Chrome 4.1.249.1036 (41514) и IE 8.0.7600.16385 с тем же результатом: оба отображали сообщение «Не удалось!», Указывая, что myParagraph не загружен (и поэтому DOM кажется неполным).

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
    <head> 
     <script type="text/javascript"> 
      window.onload = doThis(); 
      // document.onload gives the same result 

      function doThis() { 
       if (document.getElementById("myParagraph")) { 
        alert("It worked!"); 
       } else { 
        alert("It failed!"); 
       } 
      } 
     </script> 
    </head> 

    <body> 
     <p id="myParagraph">Nothing is here.</p> 
    </body> 
</html>

Я с использованием более сложных сценариев, чем это, во внешнем .js файле, но это иллюстрирует проблему. Я могу заставить его работать, если window.onload установил таймер на полсекунды, чтобы запустить doThis(), но это похоже на неэлегантное решение и не отвечает на вопрос о том, почему window.onload не работает, что все говорят, что это так. Другим решением было бы установить таймер, который будет проверять, загружен ли DOM, и если он не будет называться сам через полсекунды (так что он будет продолжать проверять до загрузки DOM), но это кажется слишком сложным для меня. Есть ли более подходящее событие для использования?

источник

2010-03-20 David Mason

Первая ошибка, которую я вижу, что вы Ассинг [результат функции] вместо [функции] сама по себе.Вы можете видеть, что 'doThis()' - это оператор, который возвращает значение undefined после оценки, потому что 'doThis' не имеет оператора' return'. 'window.onload = doThis;' выполнит эту работу. Обратите внимание, что нет скобок – Dan

@DavidMason W3Schools - плохой источник информации. Они никак не связаны с W3C. * Не * относитесь к w3schools как к авторитетному источнику информации, относитесь к ним так, как они заслуживают того, чтобы их рассматривали: неприятные ссылки, которые вам нужно пропустить, когда вы ищете настоящий справочный сайт. – doug65536

@ doug65536 Сегодня я полностью согласен. Я рекомендую w3fools.com для всех, кто не уверен. Я склонен идти прямо на developer.mozilla.org для получения высококачественной информации в эти дни, а затем выполнить более подробный поиск, если я не найду то, что я там ищу (что обычно, когда я пытаюсь сделать что-то смешное). Я довольно смущен тем, что прошлое, я опубликовал это ... но я могу удалить его! Там, одна наивная ссылка на w3schools в Интернете :) Спасибо, что заметили. –

В окне времени загружается тело все еще не загружен поэтому вы должны исправить код следующим образом:

<script type="text/javascript"> 
    window.onload = function(){ 
     window.document.body.onload = doThis; // note removed parentheses 
    }; 

    function doThis() { 
     if (document.getElementById("myParagraph")) { 
      alert("It worked!"); 
     } else { 
      alert("It failed!"); 
     } 
    } 
</script>

Испытано работать в FF/IE/Chrome, хотя и думать об обращении document.onload тоже.

Как уже упоминалось, использование js-framework будет гораздо лучшей идеей.

источник

2010-03-21 00:14:22 Li0liQ

Спасибо, что, похоже, решает мою проблему, и решает, что я думал, это рекурсия той же проблемы с присоединением чего-то к событию body.onload, прежде чем узнать, успешно ли загружено тело. У меня теперь есть сообщение «Это сработало!» выскакивая, и может продолжать педантично держать мои сценарии и разметки красивыми и раздельными. –

работал для меня тоже, спасибо помощнику! – foxybagga

Обратите внимание, что использование этого подхода для 2 скриптов, вероятно, перепишет его другим. В эти дни я обычно использую document.addEventListener («DOMContentLoaded», функция (событие) { console.log («DOM полностью загружен и разобран»); }); См. Https://developer.mozilla.org/en-US/docs/Web/Reference/Events/DOMContentLoaded –

Вы пытались использовать библиотеку javascript вместо этого, например. jQuery и это $(document).ready() функция:

$(document).ready(function() { 
     // put all your jQuery goodness in here. 
    });

источник

2010-03-21 00:00:17 M4N

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

Это определенно излишне, чтобы добавить библиотеку только для этого - загрузка библиотеки добавляет латентность и передачу данных и, вероятно, только сэкономит вам несколько символов. jQuery особенно тяжеловес. Сказав это, если вы уже используете библиотеку для других вещей, вероятно, мало или совсем не вредно использовать ее для обработки функции с событием, открытым домом. –

@ Дэвид Мейсон Я полностью согласен. В большинстве случаев я обнаружил время загрузки страницы в jQuery DOUBLES. –

Просто используйте window.onload = doThis; вместо window.onload = doThis();

источник

2010-06-04 12:13:03 dgk

для получения дополнительной информации, почему: http://stackoverflow.com/questions/8830074/what- is-the-different-between-window-onload-init-and-window-onload-init – Cymbals

Это зависит от того, где вы положили функцию OnLoad (голова или тело тега или дальше вниз), с обязательным внутренним событием seeemingly немного отличается в разных браузерах.

Смотрите также window.onload vs document.onload

источник

2011-09-10 12:37:38

Это важно понимать, что () является оператор, так же, как + или &&. () Выполняет функцию и вызывает ее.

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

Так window.onload = doThis() в основном назначая возвращаемое значение doThis для window.onload

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

ли window.onload = doThis

источник

2016-07-04 02:17:31 OverCoder

Это должен быть ответ. –

window.onload запускается до загрузки DOM (JavaScript)

ответ

Смежные вопросы