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();

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

我认为这个人就可以了。

Javascript document.open异步？

1 个答案: