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.
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
scriptelement (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
scriptswhich 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 closingbodytag) for many benefits such as ease of maintenance and fine grained cache control.