Html 为什么 javascript 没有为 document.readyState==="complete" 加载

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/16450973/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 08:13:20  来源:igfitidea点击:

Why javascript is not loading for document.readyState==="complete"

javascripthtml

提问by Ashish

I have just started learning javascript from w3schooland I have found out that "You can only use document.write in the HTML output. If you use it after the document has loaded, the whole document will be overwritten." so I have tried to write following code to check the validity:

我刚开始从w3school学习 javascript ,我发现“您只能在 HTML 输出中使用 document.write。如果在文档加载后使用它,整个文档将被覆盖。” 所以我尝试编写以下代码来检查有效性:

<html>
    <head>
        <title>ashish javascript learning</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body>
        <p> sample html with javascript </p>
        <script>
            document.write("<h1>this is heading</h1>");
            document.write("<p>this is sample para</p>");
        </script>
        <script>
            if(document.readyState === "complete"){
                loaded();
            }
            function loaded(){
                document.write("<p>loading content after the document has been loaded");
            }
        </script>
    </body>
</html>

Code is still showing the old value and is not overwriting the content of the web page. Could you suggest me what am I doing wrongly.

代码仍然显示旧值并且没有覆盖网页的内容。你能告诉我我做错了什么吗?

回答by meagar

At the time you're testing document.readyState === "complete", the document's readyState isn't"complete", it "loading", so nothing happens, and loadedis never called.

在您进行测试时document.readyState === "complete",文档的 readyState不是“完成”,而是“正在加载”,因此什么也没有发生,并且loaded永远不会被调用。

You can listen for the readyState to change, and thencheck to see if it is "complete" (or listen to window.onloadwhich is easier):

你可以监听 readyState 的变化,然后检查它是否“完成”(或者听window.onload哪个更容易):

document.onreadystatechange = function () {
  if(document.readyState === "complete"){
    loaded();
  }
}

回答by flavian

Because the mechanism is event based. You should only ever use that once the DOM is actually loaded, so it's pointless.

因为该机制是基于事件的。您应该只在实际加载 DOM 后使用它,所以它毫无意义。

The evaluation is done in place, but at the time of the evaluation document.readyState == "complete"is false, so nothing happens.

评估已就地完成,但在评估时document.readyState == "complete"false,因此没有任何反应。

The simple way to do things:

做事的简单方法:

window.onload = function() {
    loaded();
};

回答by Joseph

What you need to do is hook a function to the readystatechangeevent thencheck for the readystatevalue.

您需要做的是将函数挂接到readystatechange事件,然后检查该readystate值。

document.onreadystatechange = function () {
    if (document.readyState === 'complete') {
        initApplication();
    }
}

回答by dawn

write like this ,you will get the result you want

这样写,你会得到你想要的结果

document.onreadystatechange = function(){
   if(document.readyState == 'complete'){
      document.write('document is overwrite')
   }
}

回答by dawn

sorry for no explanation; when the code execute on the javascript the dom is not completed ,so the document's readyState is not 'complete',then the initApplication funtion will not be called; If you want to call the initApplication function,you have to add an trigger to the document.I add an trigger like 'document.onreadystatechange'."document.onreadystatechange" will be called when the document's state is changed; so when the document is loaded ,the "document.onreadystatechange" will be called

抱歉没有解释;当代码在 javascript 上执行时,dom 未完成,因此文档的 readyState 不是“完成”,则不会调用 initApplication 函数;如果你想调用initApplication函数,你必须在文档中添加一个触发器。我添加了一个触发器,如'document.onreadystatechange'。当文档的状态改变时,将调用“document.onreadystatechange”;所以当文件被加载时,“document.onreadystatechange”将被调用

回答by ITI

An excellent resource with multiple examples and explanations is: https://developer.mozilla.org/en/docs/Web/API/Document/readyState

包含多个示例和解释的优秀资源是:https: //developer.mozilla.org/en/docs/Web/API/Document/readyState

So in your case this applies:

所以在你的情况下,这适用:

document.onreadystatechange = function () {
  if (document.readyState === "complete") {
    initApplication();
  }
}