将AJAX响应加载到浏览器中(不带jQuery)

Load AJAX Response into Browser (without jQuery)

本文关键字:不带 jQuery 浏览器 AJAX 响应 加载      更新时间:2023-09-26

我正在使用以下JS代码加载远程页面:

function SendCustomRequest() {
    var request = new XMLHttpRequest(); 
    request.open("GET", "/test.html", false);
    request.send(null);
    alert(request.responseText);
}

这很好,test.html的HTML内容显示在警报消息框中。

现在我需要在浏览器窗口中显示整个test.html页面,但不显示jQuery。在原始页面(AJAX调用发生的地方)中不是div左右,但该页面必须被test.html的内容完全替换。它必须在IE8中工作。

有什么想法吗?

附言:AJAX调用也可以是异步的,如果需要的话。

该页面必须完全替换为test.html 的内容

我认为这不是一个好主意(因为我知道这在某些浏览器中是不可能的)。

您可以打开新窗口,然后将test.html的内容放在那里。

function SendCustomRequest() {
    var request = new XMLHttpRequest(); 
    request.open("GET", "/test.html", false);
    request.send(null);
    var newWindow = window.open("");
    newWindow.document.write(request.responseText);
}

看看这篇文章,了解如何设置窗口的选项。

还可以查看MSDN的文章

该页面必须完全替换为test.html 的内容

document.documentElement.outerHTML设置为request.responseText

request.onload = request.onreadystatechange = function() {
  document.documentElement.outerHTML = request.responseText
}

您说"…但该页面必须完全替换为test.html的内容"如果我完全接受你的陈述,它说页面的所有都必须被替换。

当页面的部分应该更新时,AJAX是有意义的。

如果整个页面应该被替换,则直接发出GET请求是合适的。

所以我建议在这种情况下不要使用AJAX。您提供给AJAX调用的URL(加上参数)可以分配到脚本中的window.location.href。然后浏览器将直接发出相应的GET请求并自动更新整个页面。

参见以下示例:

function getNewPage(url,parameters) {
   alert("Issueing the GET request: "+url+"?"+parameters);
   window.location.href = url + "?" + parameters;
}
function doOnload() {
   getNewPage("http://www.example.com/test.html","par1=val1&par2=val2");
}
<body onload="doOnload(); return false;">
   <p>Some dummy text</p>
</body>