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
Why javascript is not loading for document.readyState==="complete"
提问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 loaded
is 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.onload
which 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 readystate
value.
您需要做的是将函数挂接到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();
}
}