Question

我需要查看窗口是否已加载。

我想创建一个checkLoaded函数，根据我何时调用它，将返回true或false来表明这一点。

<html>
<head>
  function checkLoaded(){
    //alert true if window is loaded or alert false
  }
</head>
<body onload="checkLoaded()"> <!-- This should alert true -->
   Loding window.
   <script>
       checkLoaded();// this should alert false;
   </script>
</body>
</html>

我不想使用窗口加载时设置的全局变量。

有什么方法可以检查window对象的状态，也许是属性？

我不想使用jQuery或任何其他外部库。

Answer 1

您可以使用document.readyState属性检查文档是否已加载而不监听任何事件。它将设置为"complete"检查文档和所有子资源是否已加载。（这对应于load事件。）

function checkLoaded() {
  return document.readyState === "complete";
}

如果您只想检查文档是否已加载，而不必担心子资源，您还可以检查该属性是否为"interactive"。

function checkLoaded() {
  return document.readyState === "complete" || document.readyState === "interactive";
}

这应该可以在当前浏览器中使用，但在所有浏览器的旧版本中都不受支持。

Answer 2

您有2个活动：

addListener(document, "DOMContentLoaded", function(){});  //Dom parsing is finished
addListener(window, "load", function(){}); //loading of all external stuff is done

您可以看到here

的差异

Answer 3

这将在窗口加载时发出警告：

(function(w) {
    //private variable
    var loaded = false;
    w.onload = function() {
        loaded = true;
    };

    w.checkLoaded = function() {
        alert(loaded);
    };
})(window);

您现在可以从应用的任何部分拨打checkLoaded()，它将返回true或false。

Answer 4

也许只是这样的事情：

<html>
<script>
  var loaded = false;
  function checkLoaded(){
     alert(window.loaded);
  }
</script>
<body onload="window.loaded = true; checkLoaded()">
   Loading window.
   <script>
       checkLoaded();
   </script>
</body>
</html>

Answer 5

这有帮助吗？

<script>
    var loaded = false;
    function checkLoaded(){
        alert(loaded);
        //alert true if window is loaded or alert false
    }
</script>


<body onload="loaded = true;checkLoaded();"> <!-- This should alert true -->
   Loding window.
   <script>
       checkLoaded();// this should alert false;
   </script>
</body>

确定窗口是否已加载而不使用任何全局变量

5 个答案: