Useful JS Tips

#46 - Detect document ready in pure JS

2016-02-15 by @loverajoel

The cross-browser way to check if the document has loaded in pure JavaScript is using readyState.

if (document.readyState === 'complete') {
  // The page is fully loaded
}

You can detect when the document is ready…

let stateCheck = setInterval(() => {
  if (document.readyState === 'complete') {
    clearInterval(stateCheck);
    // document ready
  }
}, 100);

or with onreadystatechange

document.onreadystatechange = () => {
  if (document.readyState === 'complete') {
    // document ready
  }
};

Use document.readyState === 'interactive' to detect when the DOM is ready.

<<返回目录