Javascript document.open异步？

Question

所以在我的站点上有一个 Javascript 函数，它会通过 XMLHttpRequest 从服务器加载一个新站点。之后它用新页面替换当前页面:

var post = new XMLHttpRequest();
post.open('POST', data);
post.onload = function() {
    var do = document.open("text/html", "replace");
    do.write(post.responseText);
    do.close();
    goOn();
}

function goOn() {
    console.log($('img:visible'));
}

有些人可能会认为在 do.close() 之后文档已经更改并准备就绪。但它不是，例如如果我加载非常多/大数据/responseText 函数 goOn() 只记录一个空结果。显然 goOn() 在 DOM 准备好被读取之前被调用了!不幸的是，在 write() 完成后没有触发“就绪”事件……我怎么能确定它已经完成了？

/编辑:goOn() 将此记录到 Chrome 控制台:

[prevObject: p.fn.p.init[1], context: #document, selector: "img:visible"]
context: #document
length: 0
prevObject: p.fn.p.init[1]
selector: "img:visible"
__proto__: Object[0]

但如果我在那之后手动输入 $('img:visible') 到控制台，它会显示所有图像....

Answer 1

您是否尝试过将就绪事件附加到您的文档中，您可以尝试如下操作，

var post = new XMLHttpRequest();
post.open('POST', data);
post.onload = function() {
    var do = document.open("text/html", "replace");
    $(do).ready(function () { goOn(); });
    do.write(post.responseText);
    do.close();

}

function goOn() {
    console.log($('img:visible'));
}

编辑:

是的，我在 fiddler 上试过了，但是有如下所示的 JS 事件和 here

var docx = document.open();
docx.onreadystatechange = function () { alert(this.readyState) };
alert(docx);
docx.write("<div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div><div>test test test test ttetst <br /></div>");

docx.close();​

之后只需检查就绪状态并在它完成时执行您的操作。

我认为这个可以解决问题。