Document.write 只覆盖页面一次

Question

我一直在使用document.write()用AJAX加载的一些html替换现有的html。
如果每个正常加载使用一次，它可以正常工作(正常情况下我的意思是没有 AJAX(，但如果多次使用，它会在不替换现有内容的情况下写入

换句话说，第一次在第 1 页上调用 document.write() 时，第 1 页将被覆盖(按预期(，但下次调用时，新内容将附加到第 1 页。为什么？

以下是一些代码来重现我的问题：

Global JavaScript(在所有页面上(：

function loadXMLDoc(name) {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.addEventListener("load", transferComplete, false);
    xmlhttp.open("GET", name, true);
    xmlhttp.send();
    function transferComplete() {
        document.write(xmlhttp.responseText);
        history.replaceState(null, null, name);
    }
}

第一页：

<a href="#" onclick="loadXMLDoc('page2.html');">p1</a>

第二页：

<a href="#" onclick="loadXMLDoc('page3.html');">p1</a>

第三页：

<a href="#" onclick="loadXMLDoc('page1.html');">p1</a>

Answer 1

这是预期的行为。write 方法用于在呈现页面时将内容写入页面。

它仅在页面完成后使用页面时替换页面，因为第一次使用它时，它将执行隐式document.open()来启动要写入的新流。

要正确使用它来替换页面，请先调用document.open，然后使用document.write一次或多次编写内容，然后调用document.close告诉浏览器新页面已完成。

Answer 2

在 ajax 更新后写入它后调用document.close()。

值得指出的是，如果您用 ajax 响应的结果替换整个文档，那么与简单地发布普通的旧<form>或遍历<a>链接相比，很难看到引入这种复杂性的任何优势。