使用 jQuery 在浏览器中处理 XML
2010-01-20 00:00:00 来源:WEB开发网清单 1 (quotes.html)是 HTML 使用工作台的简单例子。它能够动态地从 XML 文件加载引用。
清单 1 (quotes.html). 使用 jQuery XML 工作台的 HTML 例子
<html>
<head>
<title>jQuery XML workbench</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="workbench.js"></script>
<script type="text/javascript" src="quotes.js"></script>
<!-- Put the XML file or URL in the href attribute below: -->
<link href="quotes1.xml" type="application/xml" rel="target_XML" />
</head>
<body>
<h1>A few quotations for your enjoyment</h1>
<div id="update-target"><ol></ol></div>
</body>
</html>
您需要 script 元素来自动加载 jQuery、工作台 JavaScript 以及您的应用程序特定脚本。您还需要一个 link 元素来确定 target_XML 使用的 XML 文件。如果您需要使用多个 XML 文件,扩展工作台设置非常容易。清单 2(workbench.js)是工作台脚本。
清单 2(workbench.js). jQuery XML 工作台 JavaScript
/*
workbench.js
*/
// The jQuery hook invoked once the DOM is fully ready
$(document).ready(function(){
// Get the target XML file contents (Ajax call)
var fileurl = $("link[rel='target_XML']").attr('href');
$.ajax({
url: fileurl,
type: "GET",
dataType: "xml",
complete: xml_ready,
error: error_func
});
});
// Callback for when the Ajax call results in an error
function error_func(result) {
alert(result.responseText);
}
// ns_filter, a jQuery extension for XML namespace queries.
(function($) {
$.fn.ns_filter = function(namespaceURI, localName) {
return $(this).filter(function() {
var domnode = $(this)[0];
return (domnode.namespaceURI == namespaceURI && domnode.localName == localName);
});
};
})(jQuery);
更多精彩
赞助商链接