WEB开发网
开发学院网页设计JavaScript 使用 jQuery 在浏览器中处理 XML 阅读

使用 jQuery 在浏览器中处理 XML

 2010-01-20 00:00:00 来源:WEB开发网   
核心提示: 清单 1 (quotes.html)是 HTML 使用工作台的简单例子,它能够动态地从 XML 文件加载引用,使用 jQuery 在浏览器中处理 XML(5),清单 1 (quotes.html). 使用 jQuery XML 工作台的 HTML 例子<html><head&g

清单 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); 

上一页  1 2 3 4 5 6 7 8 9 10  下一页

Tags:使用 jQuery 浏览器

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接