本文详细解析了JavaScript中document.write方法在页面加载完成后的行为。通过对比页面加载期间与加载后调用该方法的代码示例，说明了为何在鼠标点击等异步事件中调用document.write会覆盖整个文档内容，并解释了查看源文件时的差异现象。
document.write在页面加载期间的行为
作为初学者，我将这一学习笔记记录下来。该解答源自百度搜索结果，此处进行转载整理。
以下内容旨在解答一个常见问题：当页面加载完成后调用document.write，为何会导致整个文档被覆盖。
提示中提到的“HTML输出中”，特指页面正在加载渲染的阶段。
具体代码示例如下：
<html>
<head></head>
<body>
<script type="text/javascript">document.write("<p>Hello</p>");</script>
</body>
</html>当页面加载结束时，浏览器会在页面上显示“Hello”。此时查看网页源代码，内容与上述代码一致。
-------------------------
页面加载后调用document.write的覆盖效应
然而，如果页面已经加载完毕，此时再使用document.write，将会覆盖整个文档内容。
相关代码如下：
<html>
<head></head>
<body>
<script type="text/javascript">
// 当点击鼠标时调用 document.write
document.onclick = function() {
document.write("<span>Javascript</span>");
};
</script>
</body>
</html>由于鼠标点击事件发生在页面加载完成之后，执行document.write会导致整个页面被替换为<span>Javascript</span>。此时再次查看网页源代码，将只能看到<span>Javascript</span>这一部分。