关于document.write()函数对文档流内容的清空问题

最新推荐文章于 2021-11-16 18:07:12 发布

转载最新推荐文章于 2021-11-16 18:07:12 发布 · 892 阅读

文章标签：

#函数

学习笔记专栏收录该内容

3 篇文章

订阅专栏

本文探讨了JavaScript中使用document.write在不同场景下对页面内容的影响，包括在onload事件中使用、直接在script标签内使用及在新窗口中使用时的行为差异。

我只是做一个简化的记录，这里附上原文作者地址

情况一：

<script type="text/javascript">  
window.onload=function(){
  document.write("XXX");
}
</script>

window.onload事件是在文档内容加载完毕后再去执行事件处理函数，此时执行document.write()函数会自动调用document.open()函数创建一个新的文档流，所以此时原来的内容会被覆盖。

情况二：

<script type="text/javascript">  
document.write("XXX");
</script>

这时原内容不会被覆盖是因为原文档流并没有被关闭，write函数身处其中。

情况三：

<script type="text/javascript">
document.close(); 
document.write("XXX");
</script>

此时页面内容不会被覆盖，因为文档流是由浏览器创建的，开发者无权限手动关闭。【注意】document.close()函数只可以关闭由document.open()函数创建的文档流。

情况四：

<script type="text/javascript">   
function create(){  
  var newWindow=window.open("","蚂蚁部落","_blank");  
  newWindow.document.write("蚂蚁部落欢迎您");  
  newWindow.document.close();  
  newWindow.document.write("ABC"); 
}  
window.onload=function(){  
  var obt=document.getElementById("bt");  
  obt.onclick=function(){  
    create();  
  }  
}  
</script>