admin管理员组

文章数量:1404606

Is it really necessary to wait for the "ready" (or "window.onload") events if your code only manipulates DOM elements that have already been parsed entirely?

The jQuery documentation for the "ready()" function demonstrates how you could wait to perform actions until the DOM is entirely ready but the example is for code (script tags) that are listed before the DOM elements in question. But it seems that code which appears after the necessary DOM elements in an HTML document has access to them since, presumably, the DOM is built as the browser parses the document.

For example, is it safe to assume that the following code is reliable in all situations or is it still necessary (or beneficial somehow) to use a ready/onload handler?

<body>
  <div id="foo"/>
  <script type="text/javascript">
    var foo = document.getElementById('foo');
    foo.innerHTML = 'The element #foo is loaded!';
  </script>
</body>

This SO question is very similar but I wanted to bump it to see if there is any more information.

Is it really necessary to wait for the "ready" (or "window.onload") events if your code only manipulates DOM elements that have already been parsed entirely?

The jQuery documentation for the "ready()" function demonstrates how you could wait to perform actions until the DOM is entirely ready but the example is for code (script tags) that are listed before the DOM elements in question. But it seems that code which appears after the necessary DOM elements in an HTML document has access to them since, presumably, the DOM is built as the browser parses the document.

For example, is it safe to assume that the following code is reliable in all situations or is it still necessary (or beneficial somehow) to use a ready/onload handler?

<body>
  <div id="foo"/>
  <script type="text/javascript">
    var foo = document.getElementById('foo');
    foo.innerHTML = 'The element #foo is loaded!';
  </script>
</body>

This SO question is very similar but I wanted to bump it to see if there is any more information.

  • javascript
  • jquery
  • events
  • dom
Share Improve this question edited May 23, 2017 at 12:12 CommunityBot 11 silver badge asked Apr 21, 2011 at 5:16 maericsmaerics 157k47 gold badges277 silver badges299 bronze badges
Add a ment  | 

4 Answers 4

Reset to default 6

If your JavaScript code is below the DOM elements and only modifies them exclusively, you don't need to wait for the DOM ready event.

However, keep in mind editing a DOM element which contains a script element (or more specifically, before the element's closing tag) used to cause big problems in IE6 (thanks T.J. Crowder) and IE7.

However, this requires inline scripts which can be a maintenance problem. It is preferred to have your JavaScript stored externally (and many speak of the benefits of including them before the closing body tag) for many benefits such as ease of maintenance and fine grained cache control.

in your case it is fine because the browser will render your code line by line and in your code id="foo" es first so it will get that div....but suppose you wrote this script in head tag then the script will run first and it wont get the div with id="foo" because its not yet loaded..its better to write in document.ready method

Yes, it's safe if you js code is after dom but usually it's not relly good idea to mix html and js.

Document is loaded in linear fashion so your code works correctly. Sometimes programmers do not use document ready for performance purpose when the javascript is not depends on the DOM below it. Here is some example.

本文标签： javascriptIs it really necessary to wait for DOM ready to manipulate the DOMStack Overflow

版权声明：本文标题：javascript - Is it really necessary to wait for DOM ready to manipulate the DOM? - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744824425a2626976.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。