如何通过 XMLHttpRequest 的响应“搜索”答案

【问题标题】：How to "search" through the response of an XMLHttpRequest如何通过 XMLHttpRequest 的响应“搜索”
【发布时间】：2011-01-24 19:44:57
【问题描述】：

我对以下代码有疑问

<html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    return xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","index.html",true);
xmlhttp.send();


}
</script>
</head>
<body>

<div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="loadXMLDoc()">Change Content</button>

</body>
</html>

现在我想在 xmlhttp.responseText（换句话说，调用函数 loadXMLDoc()）中搜索关键字，例如“testfile”，如果存在多个示例“testfile_1”和 "testfile_2"....."testfile_n" 然后是 "doSomething"

喜欢这个

 <html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    return xmlhttp.responseText;
    }
  }



}
function searchADocument(wordToSearchFor){
xmlhttp.open("GET","index.html",true);
xmlhttp.send();
int numberOfTimesWordOccurs=0;
var thePageToSearchThrough [] = loadXMLDoc();
for (i=0; i<thePageToSearchThrough.length; i++){
if(thePageToSearchThrough[i]==wordToSearchFor)
 numberOfTimesWordOccurs++;
}
If  (numberOfTimesWordOccurs > 1) 
document.write("<a href="http://selnc05.go.se:8080/component_test/build/testfile_1">    testfile_1</a>"<a href="http://selnc05.go.se:8080/component_test/build/testfile_2">    testfile_2</a><a href="http://selnc05.go.se:8080/component_test/build/testfile_n">    testfile_n</a>

)

Else

window.location="http://selnc05.go.se:8080/component_test/build/testfile.html";

}
</script>
</head>
<body>

<div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="searchADocument("testfile")">Change Content</button>

</body>
</html>

我不知道从哪里开始，因为我不知道 xmlhttp.responseText 是什么类型，我可以将它存储在一个数组中并使用 for 循环等进行扫描吗？提前致谢。 =)

编辑我在这里做错了什么

<html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {

    return xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","index.html",true);
xmlhttp.send();
}

function searchADocument(){ //wordToSearchFor
var txt=loadXMLDoc();
if(txt.test('hello'))alert('responseText contains "hello"');
else{
    document.getElementById("myDiv").innerHTML ="helloaj";
}

}
</script>
</head>
<body>

<div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="searchADocument()">Change Content</button>

</body>
</html>

在 if(txt.test('hello')) 上得到以下错误消息：Jscript error:'undefined' is null or not an object

编辑 3 我猜我傻得要死，但我仍然无法让它工作，为什么我不能将 xmlhttp.responseText 存储到变量中？

像这样

<html>
<head>
<script type="text/javascript">
var xmlhttp;
function loadXMLDoc(url,cfunc)
{
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=cfunc;
xmlhttp.open("GET",url,true);
xmlhttp.send();
}
function myFunction()
{
loadXMLDoc("ajax_info.txt",function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
     var txt=xlmhttp.responseText;//This aint working, why, how can I store xlmhttp.responseText into a variable, that I can peform a search on?
    document.getElementById("myDiv").innerHTML=txt;//This aint working, why?????
    }
  });
}
</script>
</head>
<body>

<div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="myFunction()">Change Content</button>

</body>
</html>

如果我替换以下内容，我可以补充说上述内容确实有效

 var txt=xlmhttp.responseText;
document.getElementById("myDiv").innerHTML=txt;

有了这个

document.getElementById("myDiv").innerHTML=xlmhttp.responseText;

我没有得到回调函数，如下所述，我得到的只是 xmlhttp 是未定义的，所以我问这个有效（至少是我想要的一半）。

再次抱歉不理解，但肯定有一些明显的东西我不明白，这根本不可能将它存储在变量或其他东西中。

【问题讨论】：

1. if 和 else 是应该用小写字母编写的语句（JavaScript 关键字区分大小写） 2. 您的大括号不匹配 3. 您没有在字符串中转义双引号 4. 使用 document.write通常不是一个好主意 5. 你为什么不知道xmlhttp.responseText 是什么类型？您正在从您的服务器请求文档，所以我希望您知道它发送的内容

标签： javascript html xmlhttprequest

【解决方案1】：

var txt=loadXMLDoc();

loadXMLDoc 不返回任何内容，因此 txt 在此之后是 undefined。当然undefined没有test方法，是String.prototype的方法。

而是为您的XMLHttpRequest 分配一个回调处理程序，然后在那里做任何您想做的事情。

xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState == 4)
        if (xmlhttp.status==200) {
            // do something with xmlhttp.responseText
        } else {
            // do something appropriate with status
        }
}

更新：虽然我认为通常不宜使用此类复制粘贴示例，但我可以向您展示您应该将这段代码放在哪里。而不是这样做：

function searchADocument() { //wordToSearchFor
    var txt = loadXMLDoc();
    if (txt.test('hello'))
        alert('responseText contains "hello"');
    else
        document.getElementById("myDiv").innerHTML = "helloaj";
}

在您测试loadXMLDoc 的返回值的地方（如前所述，它会立即返回，因此在请求完成之前），您应该将代码放入回调处理程序中，即您通过设置onreadystatechange进行分配：

xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
        var txt=xmlhttp.responseText; /* manipulate the DOM here */
        if (txt.test('hello'))
            alert('responseText contains "hello"');
        else
            document.getElementById("myDiv").innerHTML = "helloaj";
    }
}

【讨论】：

我不知道你的意思，我现在已经按照你的建议进行了编辑，但它仍然无法正常工作，你可以看看 www.tdsoft.se 自己看看有什么问题吗？它表示 JScript 运行时错误：对象不支持此属性或方法，换句话说，“var txt=xmlhttp.responseText;”不是字符串吗？再次感谢 =)
@Anders - 我在上面的回答中解释了这一点，请阅读更多关于 XMLHttpRequest on MDC 的信息。 xmlhttp.send 立即返回，无需等待请求的响应。您只能在回调处理程序中操作响应（或在被触发之后）。
你能给我举个例子吗，因为我完全卡住了（是的，当遇到这类问题时我很慢）。我在这里谈论一个完整的工作示例，如果你有时间 =)