Home/ Questions/Q 7993163
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-04T13:46:12+00:00

This has not been answered here or there . These questions are poorly worded,

  • 0

This has not been answered here or there. These questions are poorly worded, and the answers are all along the lines of “use DOMReady”.

I want to ensure that code is run only if the page has finished loading. I cannot alter the HTML file itself, but if I could, I would do something that amounts to this:

<!DOCTYPE html>
<html>
  <head>
    <script>window.loaded=false;</script>
  </head>
  <body onload="window.loaded=true;">
    <!-- ... -->
  </body>
</html>

Then in my code:

if (window.loaded) { run(); }
else { document.addEventListener("load", run); }

And that would achieve exactly what I want. Unfortunately, I cannot modify the HTML, which means that I am looking for a way to determine whether the document has loaded (not if the DOM is ready) from JS code only.

I have looked around quite a bit, but so far, all I have found revolves around DOMReady. Has no-one really ever looked for this?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    As Dr.Molle points out, document.readyState contains the property you’re after:

    document . readyState

    Returns "loading" while the Document is loading, "interactive" once it is finished parsing but still loading sub-resources, and "complete" once it has loaded.

    The readystatechange event fires on the Document object when this value changes.

    The order of event firing and readyState change is defined in the end of parsing section of the HTML5 spec. In summary:

    1. The document readyState is set to "interactive" as soon as parsing is complete.
    2. The DOMContentReady event is fired almost immediately (after it’s determined which resources need to be loaded).
    3. Those resources are loaded.
    4. The document readyState is set to "complete" and the load event is fired.
    • 0