Question

我有一段JS代码需要确定如果DOM已加载。我知道有多种方法可以在DOM加载时执行JS代码，如：

$(document).ready(function() { ... }); // Jquery version

document.body.onload = function() { ... } // Vanila JS way

我正在寻找一些看起来像

的方法

function isDOMLoaded() {
    // Do something to check if DOM is loaded or not
    // return true/false depending upon logic
}

PS：更新（接受答复后接受） 我碰巧看到jquery也使用相同的方法来检查DOM是否已加载。看看Implementation of jquery.ready() here

bindReady: function() {
    if ( readyBound ) {
        return;
    }

    readyBound = true;

    // Catch cases where $(document).ready() is called after the
    // browser event has already occurred.
    if ( document.readyState === "complete" ) {
        return jQuery.ready();
    }

    ...

Answer 1

function isDOMLoaded(){
 return document.readyState == 'complete';
}

Answer 2

你可以使用这样的东西

function isLoaded() {
    return (document.readyState === 'ready' ||
            document.readyState === 'complete')
}

检查ready和complete状态。

ready只有很短的时间，但确实反映了DOM准备好了。页面完全加载后，状态将更改为“完成”。如果您碰巧只检查准备就绪，则该功能将失败，因此我们也会检查此状态。

Answer 3

这个怎么样？

var flgDOMLoaded=false; //Set a global variable
 $(document).ready(function() { 
   flgDOMLoaded= true;
  // Some code
 });

function isDOMLoaded() {
   return flgDOMLoaded; // return it. 
  //You don't need this function at all. You could just access window.flgDOMLoaded
}

如何知道文档是否已加载

3 个答案: