如何使用Javascript和cgi显示结果，以及<；iframe>；及<；对象>；？

我有一个输入表单，可以实时显示三种不同的基于cgi的查找结果

我的第一种方法是使用三个iFrame，每次搜索时我都会更改.src，这很有效，但感觉不必要：

<iframe id="iframe1">
document.getElementById("iframe1").src="/cgi-bin/one.cgi";

document.getElementById（“iframe1”）.src=“/cgi-bin/one.cgi”；

我的第二种方法是使用三个对象：s，它们的.data已更改，但这感觉和外观都很糟糕：

<object id="object1">
document.getElementById("object1").data="/cgi-bin/one.cgi";

document.getElementById（“object1”）.data=“/cgi-bin/one.cgi”；

以上两个例子在功能上都有效，但我想知道更好的方法。例如，如何使用div获得相同的结果？也就是说，没有iframe:s或object:s。

替代方法是使用。这意味着您必须创建并发送

XMLHttpRequest

。收到响应后，您必须将其放入

中

下面是一个极简主义的例子：

var div = document.getElementById("results");

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4) {
        if (this.status == 200) {
            div.innerHTML = this.responseText;
        } else {
            div.innerHTML = "<h1>Error " + this.status + "</h1><p>The content could not be loaded.</p>";
        }
    }
};
xhttp.open("GET", "/cgi-bin/one.cgi", true);
xhttp.send();

var div=document.getElementById（“结果”）；
var xhttp=newXMLHttpRequest（）；
xhttp.onreadystatechange=函数（）{
if（this.readyState==4）{
如果（this.status==200）{
div.innerHTML=this.responseText；
}否则{
div.innerHTML=“Error”+this.status+”无法加载内容。
”；
}
}
};
xhttp.open（“GET”，“/cgi-bin/one.cgi”，true）；
xhttp.send（）；

对于跨浏览器兼容性，我建议使用或