Images and other resources may still continue loading. So the script doesn’t block DOM building and page rendering. For full details on this event please see the page on the Document: DOMContentLoaded event.
A common misconception is that styles have no bearing on domContentLoaded, but that is untrue according to the W3 HTML5 specification. You can use the DOMContentLoaded event as the trigger for executing your code. We’d like our function to execute when the DOM is loaded, be it now or later. This post is licensed via Creative Commons Attribution-NonCommercial-ShareAlike 4.0. If this sounds interesting, sign up below and I'll notify you when I publish something. What happens if we set the DOMContentLoaded handler after the document is loaded? Do this by using document.addEventListener() to tie a custom function to the event. Attributes async and defer work only for external scripts. What is the place of readystatechange among other events? To see the timing, here’s a document with