我正在尝试编写一个简单的函数来从 JavaScript 中的 XML 加载数组。在调用 $.ajax(...) 时，我已成功地使用 success: 字段将 AJAX 结果发送到函数。
此外，我注意到函数 $.ajax(...) 的返回值是一个 Object，其中包含字段 responseText 和 responseXML (我很乐意使用)。但是，即使我可以在控制台上的树中看到它们，尝试通过 .responseText 访问它们也不起作用(因此打印 undefined，如果我是尝试查找一些垃圾字符串.this_does_not_exist)。
我将使用几个不同的 XML 文件以几乎相同的方式执行此操作，我想使用代码来执行此操作。我不满足于简单地让 success: 参数将结果踢到一个单独的函数，是因为我可能会多次使用数据，但只想加载一次。我试图将 XML 的加载和使用分开，这样就不会多次加载它。
你能告诉我为什么当我输出 xml_ret 时会出现 responseText，但 xml_ret.responseText 无法访问它？
非常感谢您的帮助和耐心。
<小时/>注意:要从同一目录加载 test.xml，您需要通过以下方式启动 Chrome 或 Chromium:
chromium-browser --allow-file-access-from-files
test.html:
<html>
<head>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
function print_XML(xml)
{
console.log( "in printXML" );
console.log(xml);
$(xml).find("point").each(function()
{
var loaded_row = [ parseInt($(this).attr("number_protein_groups")), parseInt( $(this).attr("log_likelihood") ) ];
console.log( loaded_row );
});
}
function load_and_print_XML(fname)
{
console.log( "in load_and_print_XML" );
xml_ret = $.ajax({
type: "GET",
url: fname,
dataType: "xml",
success: print_XML
});
console.log( "xml_ret" );
console.log( xml_ret );
console.log( xml_ret.responseText );
}
</script>
</head>
<body>
<script type="text/javascript">
xml_data = load_and_print_XML("test.xml");
/* do something with xml_data here */
</script>
</body>
</html>
test.xml
<?xml version="1.0" encoding="utf-8" ?>
<results>
<replicate_result graph_filename="yeast_1.pivdo">
<point number_protein_groups="10" log_likelihood="20"/>
<point number_protein_groups="20" log_likelihood="40"/>
<point number_protein_groups="40" log_likelihood="60"/>
<point number_protein_groups="50" log_likelihood="50"/>
<point number_protein_groups="60" log_likelihood="55"/>
</replicate_result>
</results>
我的控制台:
in load_and_print_XML
test.html:30xml_ret
test.html:31
Object
abort: function (a){a=a||"abort",p&&p.abort(a),w(0,a);return this}
always: function (){i.done.apply(i,arguments).fail.apply(i,arguments);return this}
complete: function (){if(c){var a=c.length;n(arguments),j?l=c.length:e&&e!==!0&&(k=a,o(e[0],e[1]))}return this}
done: function (){if(c){var a=c.length;n(arguments),j?l=c.length:e&&e!==!0&&(k=a,o(e[0],e[1]))}return this}
error: function (){if(c){var a=c.length;n(arguments),j?l=c.length:e&&e!==!0&&(k=a,o(e[0],e[1]))}return this}
fail: function (){if(c){var a=c.length;n(arguments),j?l=c.length:e&&e!==!0&&(k=a,o(e[0],e[1]))}return this}
getAllResponseHeaders: function (){return s===2?n:null}
getResponseHeader: function (a){var c;if(s===2){if(!o){o={};while(c=bG.exec(n))o[c[1].toLowerCase()]=c[2]}c=o[a.toLowerCase()]}return c===b?null:c}
isRejected: function (){return!!i}
isResolved: function (){return!!i}
overrideMimeType: function (a){s||(d.mimeType=a);return this}
pipe: function (a,b,c){return f.Deferred(function(d){f.each({done:[a,"resolve"],fail:[b,"reject"],progress:[c,"notify"]},function(a,b){var c=b[0],e=b[1],g;f.isFunction(c)?i[a](function(){g=c.apply(this,arguments),g&&f.isFunction(g.promise)?g.promise().then(d.resolve,d.reject,d.notify):d[e+"With"](this===i?d:this,[g])}):i[a](d[e])})}).promise()}
progress: function (){if(c){var a=c.length;n(arguments),j?l=c.length:e&&e!==!0&&(k=a,o(e[0],e[1]))}return this}
promise: function (a){if(a==null)a=h;else for(var b in h)a[b]=h[b];return a}
readyState: 4
responseText: "<?xml version="1.0" encoding="utf-8" ?>↵<results>↵ <replicate_result graph_filename="yeast_1.pivdo">↵ <point number_protein_groups="10" log_likelihood="20"/>↵ <point number_protein_groups="20" log_likelihood="40"/>↵ <point number_protein_groups="40" log_likelihood="60"/>↵ <point number_protein_groups="50" log_likelihood="50"/>↵ <point number_protein_groups="60" log_likelihood="55"/>↵ </replicate_result>↵</results>"
responseXML: Document
setRequestHeader: function (a,b){if(!s){var c=a.toLowerCase();a=m[c]=m[c]||a,l[a]=b}return this}
state: function (){return e}
status: 200
statusCode: function (a){if(a){var b;if(s<2)for(b in a)j[b]=[j[b],a[b]];else b=a[v.status],v.then(b,b)}return this}
statusText: "success"
success: function (){if(c){var a=c.length;n(arguments),j?l=c.length:e&&e!==!0&&(k=a,o(e[0],e[1]))}return this}
then: function (a,b,c){i.done(a).fail(b).progress(c);return this}
__proto__: Object
test.html:32undefined
test.html:9in printXML
test.html:10
Document
<results>
<replicate_result graph_filename="yeast_1.pivdo">…</replicate_result>
</results>
test.html:15[10, 20]
test.html:15[20, 40]
test.html:15[40, 60]
test.html:15[50, 50]
test.html:15[60, 55]
最佳答案
针对问题:
Can you tell me why responseText shows up when I output xml_ret, but is not accessible by xml_ret.responseText?
发生这种情况是因为当您对对象执行 console.log 时(例如在 Chrome 中)，会在控制台中保留对该对象的引用。如果对象发生更改，这些更改将由 Chrome 的控制台反射(reflect)。
所以当你这样做时会发生什么:
console.log( "xml_ret" );
console.log( xml_ret );
console.log( xml_ret.responseText );
ajax 请求尚未完成，responseText 仍未分配，这就是它显示为未定义的原因。然而，打印的 xml_ret 对象是对对象的引用，因此当 ajax 请求完成时，如果您去检查控制台上的值，它就会有一个“responseText”属性，因为它已经被设置了。
如果你调试代码并在这一行添加断点，你可以看到:
console.log( xml_ret.responseText );
查看文件 xml_ret 时，它没有“responseText”属性。
PS:我需要确认一下这个评论。想得太晚了:P
关于javascript - 使用 AJAX 加载并返回数据以供稍后使用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10149126/