A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from https://developer.mozilla.org/en-US/docs/Web/API/Document/readyState below:

Document: readyState property - Web APIs

Value

The readyState of a document can be one of following:

loading

The document is still loading (that is, the HTML parser is still working).

interactive

The document has been parsed but sub-resources such as deferred and module scripts, images, stylesheets, and frames are still loading. Once in this state, and the deferred and module scripts have executed, the DOMContentLoaded event fires.

complete

The document and all sub-resources have finished loading. The state indicates that the load event is about to fire.

Examples Different states of readiness
switch (document.readyState) {
  case "loading":
    // The document is loading.
    break;
  case "interactive": {
    // The document has finished loading and we can access DOM elements.
    // Sub-resources such as scripts, images, stylesheets and frames are still loading.
    const span = document.createElement("span");
    span.textContent = "A <span> element.";
    document.body.appendChild(span);
    break;
  }
  case "complete":
    // The page is fully loaded.
    console.log(
      `The first CSS rule is: ${document.styleSheets[0].cssRules[0].cssText}`,
    );
    break;
}
readystatechange as an alternative to DOMContentLoaded event
// Alternative to DOMContentLoaded event
document.onreadystatechange = () => {
  if (document.readyState === "interactive") {
    initApplication();
  }
};
readystatechange as an alternative to load event
// Alternative to load event
document.onreadystatechange = () => {
  if (document.readyState === "complete") {
    initApplication();
  }
};
readystatechange as event listener to insert or modify the DOM before DOMContentLoaded
document.addEventListener("readystatechange", (event) => {
  if (event.target.readyState === "interactive") {
    initLoader();
  } else if (event.target.readyState === "complete") {
    initApp();
  }
});
Specifications Browser compatibility

Loading…

See also

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.5