Question

我正在运行GM_xmlhttpRequest（在Greasemonkey脚本中）并将responseText存储到新创建的HTML元素中：

var responseHTML = document.createElement('HTML');
...
onload: function() { responseHTML.innerHTML = response.responseText; }

然后我试图在responseHTML中找到一个元素：

console.log(responseHTML.getElementsByTagName('div'));
console.log(responseHTML.getElementById('result_0'));

第一个工作正常，但不是第二个。有什么想法吗？

Answer 1

使用DOMParser()将responseText转换为可搜索的DOM树此外，您尝试搜索/使用从responseText派生的任何内容，必须在onload函数内进行。

使用这样的代码：

GM_xmlhttpRequest ( {
    ...
    onload:     parseAJAX_ResponseHTML,
    ...
} );

function parseAJAX_ResponseHTML (respObject) {
    var parser      = new DOMParser ();
    var responseDoc = parser.parseFromString (respObject.responseText, "text/html");

    console.log (responseDoc.getElementsByTagName('div'));
    console.log (responseDoc.getElementById('result_0'));
}

当然，还要验证标识为result_0的节点实际上是否在返回的HTML中。（使用Firebug，Wireshark等）

Answer 2

getElementById不是HTML元素的方法。它是文档节点的一种方法。因此你不能这样做：

div.getElementById('foo'); // invalid code

您可以通过递归遍历children来实现自己的函数来搜索DOM。在较新的浏览器上，您甚至可以使用querySelector方法。对于最小的开发，您可以使用jQuery或sizzle.js（jQuery背后的查询引擎）等库。

Answer 3

无需将响应存储在元素中也不需要使用DOMParser（）

只需将responseType设置为'document'，响应将自动解析并存储在responseXML中

示例：

var ajax = new XMLHttpRequest();
ajax.open('get','http://www.taringa.net');
ajax.responseType = 'document';
ajax.onload = function(){
    console.log(ajax.responseXML); //And this is a document which may execute getElementById
};
ajax.send();

尝试解析AJAX响应时“getElementById不是函数”？

3 个答案: