为什么document.write（）在Firefox和Chrome中的行为有所不同？ [英] Why document.write() behaves differently in Firefox and chrome?
问题描述
我正在制作一个简单的重定向脚本，用于在5秒钟之后将用户重定向到 2.html 。
当我在Chrome上测试脚本时，它的工作原理！，但在最新的Firefox中，但它不会减少秒和挂起。
我是初学者，已经尽力了出于知识，但我无法解决这个问题，我在网上查找，但无法找到解决方案。如何解决这个问题？
我的代码：
index.html：
< html>
< head>
< title>我的第一页< / title>
< script type =text / javascriptsrc =script.js>< / script>
< / head>
< body>
< input type =buttonvalue =YESonclick =yes（）/>
< / body>
< / html>
script.js：
c = 5;
函数是（）{
alert（Right）;
var ans = 0;
while（ans == 0）{
var x = prompt（Your Name？）;
var ans = confirm（你的名字是+ x +right？）;
}
document.write（'< h1> Welcome'+ x +'< / h1>< p id =show>您正在被重定向3秒< / p>' ）;
function updateShow（）{
document.getElementById（'show'）。innerHTML =< h1>您正在被重定向到+ c +秒< / h1>;
c = c-1;
if（c <0）{
document.location ='2.html';
}
else {
setTimeout（function（）{updateShow（）;}，1000）;
$ b var iAmTimer = setTimeout（function（）{updateShow（）;}，1000）;
code $
2.html： $ / p>
< html>
< body>
< h1>欢迎< / h1>
< / body>
< / html>
控制台错误讯息
- Firefox - 无
- Chrome - 无
输出：
-
Firefox（forever）：
欢迎< name>
您正在3秒内被重定向
-
Chrome：
欢迎<名称>
您正在重定向3秒
欢迎< name>
您在2秒钟内被重定向
欢迎< name>
您正在重定向1秒
欢迎< name>
您正在被重定向到0秒
$
解决方案您应该只使用 document.write（） 在文档加载时即时插入内容。
根据 MDN的文档：
$ b
写入已经加载的文档，而不用调用 document.open（） 会自动执行 文档。 open（） 调用
从 document.open（） ：
lockquote
如果目标文件存在，这个方法清除它
因此，使用 document.wri te（） 将覆盖（或清除）您的文档。由于这样的原因，使用 document.write（）的被认为是一个不好的做法使用
document.body.innerHTML + =' < h1> Welcome'+ x +'< / h1>< p id =show>您正在被重定向3秒钟< / p>;
而不是将内容隐藏在 HTML 之前将会解决这个问题。
a>
这是如何工作在铬，对我来说是一个谜，恕我直言 - 它不应该。 b
$ b
更新：
从 DOC's ：
$ b
另外，自动 document.open （） 调用发生在 document.write（）的 在页面加载完成后调用，但W3C规范没有定义。
所以它不再是神秘的，因为没有规范，不同的浏览器以不同的方式实现。还有一个理由要避免 document.write （） ：）
I am making a simple Redirect script that will redirect users to 2.html after 5 seconds.
When I tested the script on Chrome and it works!, But in latest Firefox but it doesn't decrease seconds and hangs.
I am a beginner and have tried my best out of knowledge but I am unable to solve this, I looked online but was unable to find a solution. How can I solve this?
My code:
index.html:
<html>
<head>
<title>My First Page</title>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<input type="button" value=" YES " onclick="yes()" />
</body>
</html>
script.js:
c=5;
function yes() {
alert("Right");
var ans=0;
while(ans==0){
var x=prompt("Your Name?");
var ans=confirm("Your Name is "+x+" right?");
}
document.write('<h1>Welcome '+x+' </h1><p id="show">You are being redirected in 3 seconds</p>');
function updateShow(){
document.getElementById('show').innerHTML="<h1>You are being redirected in "+c+" seconds</h1>";
c=c-1;
if(c<0){
document.location='2.html';
}
else{
setTimeout(function(){ updateShow(); },1000);
}
}
var iAmTimer= setTimeout(function(){ updateShow(); },1000);
}
2.html:
<html>
<body>
<h1>Welcome</h1>
</body>
</html>
Console Error Messages
- Firefox - None
- Chrome - None
Output:
Firefox (forever):
Welcome <name>
You are being redirected in 3 seconds
Chrome:
Welcome <name>
You are being redirected in 3 seconds
Welcome <name>
You are being redirected in 2 seconds
Welcome <name>
You are being redirected in 1 seconds
Welcome <name>
You are being redirected in 0 seconds
Any help is appreciated.
解决方案 You should only be using document.write() to insert content on the fly while document is being loaded.
According to MDN's doc:
Writing to a document that has already loaded without calling document.open() will automatically perform a document.open() call
And from document.open():
If a document exists in the target, this method clears it
So, Using document.write() after the document is loaded will overwrite (or clear) your document. For such reasons, using document.write() is considered a bad practice.
Using
document.body.innerHTML+= '<h1>Welcome ' + x + ' </h1><p id="show">You are being redirected in 3 seconds</p>';
instead or having the content hidden in HTML before hand will fix the issue.
See also What are alternatives to document.write?
How this works in chrome, is a mystery to me, IMHO - it shouldn't.
Update:
From DOC's:
Also, an automatic document.open() call happens when document.write() is called after the page has loaded, but that's not defined in the W3C specification.
So it is no more mystery, since there is no spec, different browsers implemented it differently. One more reason to avoid document.write() :)
这篇关于为什么document.write（）在Firefox和Chrome中的行为有所不同？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
