3

我有一段 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 是否已加载。看看jquery.ready() 这里的实现

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();
    }

    ...
4

3 回答 3

17 
function isDOMLoaded(){
 return document.readyState == 'complete';
}
于 2013-05-20T05:42:47.490 回答
3

你可以使用这样的东西

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

检查ready和complete状态。

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

于 2013-05-20T05:42:43.637 回答
2

这个怎么样？

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
}
于 2013-05-20T05:41:22.733 回答