Javascript-如何检测文档是否已加载（IE 7 / Firefox 3）

Question

我想在文档加载后调用一个函数，但是文档可能尚未加载完成，也可能尚未加载完成。如果确实加载，那么我可以调用该函数。如果未加载，则可以附加事件监听器。在onload已经触发之后，我无法添加事件监听器，因为它不会被调用。那么如何检查文档是否已加载？我尝试了下面的代码，但不能完全正常工作。有任何想法吗？

var body = document.getElementsByTagName('BODY')[0];
// CONDITION DOES NOT WORK
if (body && body.readyState == 'loaded') {
    DoStuffFunction();
} else {
    // CODE BELOW WORKS
    if (window.addEventListener) {  
        window.addEventListener('load', DoStuffFunction, false);
    } else {
        window.attachEvent('onload', DoStuffFunction);
    }
}

Answer 1

不需要galambalazs提到的所有代码。在纯JavaScript中实现跨浏览器的方法只是测试document.readyState：

if (document.readyState === "complete") { init(); }

jQuery也是这样做的。

根据加载JavaScript的位置，可以在一个间隔内完成：

var readyStateCheckInterval = setInterval(function() {
    if (document.readyState === "complete") {
        clearInterval(readyStateCheckInterval);
        init();
    }
}, 10);

实际上，document.readyState可以具有三种状态：

文档加载时返回“ loading”，解析完成后返回“ interactive”，但仍加载子资源，加载后返回“ complete”。

因此，如果你只需要准备DOM，请检查document.readyState === "interactive"。如果你需要准备整个页面，包括图像，请检查document.readyState === "complete"。