这个可以工作。我只是为了更好的可读性,将构建块分开了。
查看解释和内联注释以理解其工作原理以及为什么必须像这样制作。
当然,这不能用于检索跨域内容,对于这个问题,您要么必须通过自己的脚本代理调用,要么考虑集成类似 flXHR(使用Flash进行跨域Ajax) 的东西。
call.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>asd</title>
<script src="jquery.js" type="text/javascript"></script>
<script src="xmlDoc.js" type="text/javascript"></script>
<script src="output.js" type="text/javascript"></script>
<script src="ready.js" type="text/javascript"></script>
</head>
<body>
<div>
<input type="button" id="getit" value="GetIt" />
</div>
</body>
</html>
jquery.js 是 (jQuery 1.3.2 未压缩版本)
test.html 是一个有效的XHTML文档
xmlDoc.js
jQuery.createXMLDocument = function( s ) {
var xmlDoc;
if ( window.ActiveXObject ) {
xmlDoc = new ActiveXObject('Microsoft.XMLDOM');
xmlDoc.async = "false";
xmlDoc.resolveExternals = false;
xmlDoc.validateOnParse = false;
xmlDoc.loadXML(s);
} else {
xmlDoc = ( new DOMParser() ).parseFromString( s, "text/xml" );
}
return xmlDoc;
};
output.js
function headerData(data) {
var x = jQuery("head", data).eq(0);
alert(jQuery("title", x).eq(0).text());
jQuery("script[src]", x).each(function(index) {
alert((index+1)+" "+jQuery.attr(this, 'src'));
});
jQuery("script:not([src])", x).each(function(index) {
alert(this.text);
});
}
ready.js
$(document).ready(function() {
$('#getit').click(function() {
$.ajax({
type : "GET",
url : 'test.html',
dataType : "xml",
beforeSend: function(xhr) {
if (xhr.overrideMimeType) {
xhr.overrideMimeType('text/xml');
}
},
success: function(data) {
headerData(data);
},
error : function(xhr, textStatus, errorThrown) {
if (textStatus == 'parsererror') {
var xmlDoc = jQuery.createXMLDocument(xhr.responseText);
headerData(xmlDoc);
} else {
alert("Failed: " + textStatus + " " + errorThrown);
}
}
});
});
});
在Opera中,整个过程都不需要使用
createXMLDocument
和
beforeSend
函数。
为了解决Firefox(3.0.11)和IE6(无法测试IE7、IE8和其他浏览器)的问题,需要额外的技巧,因为它们在服务器返回的
Content-Type:
没有指示它是xml时会出现问题。我的Web服务器针对
test.html
返回了
Content-Type: text/html; charset=UTF-8
。在这两个浏览器中,jQuery调用了
error
回调,并且
textStatus
显示
parsererror
。这是因为在jQuery.js的第3706行。
data = xml ? xhr.responseXML : xhr.responseText
data
被设置为 null。在 FF 和 IE 中,xhr.responseXML
是 null。这是因为它们无法识别返回的数据为 xml(而 Opera 可以)。只有 xhr.responseText
包含整个 xhtml 代码。由于 data 是 null,所以第3708行出现了问题。
if ( xml && data.documentElement.tagName == "parsererror" )
抛出一个异常,该异常在第3584行被捕获,并将状态设置为parsererror
。
在Firefox中,我可以通过在发送请求之前使用overrideMimeType()
函数来解决这个问题。
但是IE不支持XMLHttpRequest对象上的此函数,因此如果运行错误回调并且错误为parsererror
,则必须自己生成XMLDocument。
test.html示例。
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Plugins | jQuery Plugins</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">var imagePath = '/content/img/so/';</script>
</head>
<body>
</body>
</html>