javascript - Document.write 只覆盖页面一次

Question

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

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

这里有一些代码可以重现我的问题:

全局 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 告诉浏览器新页面已完成。