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

Question

Javascript - 如何检测文档是否已加载（IE 7 / Firefox 3）我想在文档加载后调用函数，但文档可能已经或可能尚未完成加载。如果它确实加载了，那么我可以调用该函数。如果它没有加载，那么我可以附加一个事件监听器。我无法在onload已经触发后添加一个eventlistener，因为它不会被调用。那么如何检查文档是否已加载？我尝试了下面的代码，但它并不完全有用。有任何想法吗？var body = document.getElementsByTagName('BODY')[0];// CONDITION DOES NOT WORKif (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可以有三种状态：

在文档加载时返回“加载”，在完成解析但仍加载子资源时返回“交互”，并在加载后“完成”。- Mozilla Developer Network的document.readyState

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

Answer 2

您可能希望使用类似jQuery的东西，这使得JS编程更容易。

就像是：

$(document).ready(function(){
   // Your code here});

似乎做你想做的事。