Welcome 微信登录

首页 / 脚本样式 / JavaScript / JQuery解析XML数据的几个简单实例

用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做。下面我们来总结几个使用JQuery解析XML的例子。
第一种方案:
<script type="text/javascript">$(document).ready(function() {$.ajax({ url: "http://www.jb51.net/cgi/test.xml", dataType: "xml", success: function(data){ //console.log(data); $(data).find("channel").find("item").each(function(index, ele) {var titles = $(ele).find("title").text();var links = $(ele).find("link").text();console.log(titles+"-----");$("#noticecon").find("ol").append("<li><a href=""+links+"">"+titles+"</a></li>");});}});}) </script><div id="noticecon"><ol></ol></div>
第二种方案:
<script type="text/javascript">$.get("http://www.jb51.net/cgi/test.xml", function(data){$(data).find("channel").find("item").each(function(index, ele){var titles = $(ele).find("title").text();var links = $(ele).find("link").text();$("#noticecon").find("ol").append("<li><a href=""+links+"">"+titles+"</a></li>");})});</script><div id="noticecon"><ol></ol></div>
一般步骤如下:
1. 读取xml文件
$.get("xmlfile.xml",function(xml){//xml即为可以读取使用的内容,具体读取见第2点});
2. 读取xml内容
如果读取的xml是来于xml文件,这结合上面的那点,处理如下:
$.get("xmlfile.xml",function(xml){$(xml).find("item").length;});
如果读取的是xml字符串,则要注意一点,xml字符串的必然被"<xml>"和"</xml>"包围才可以被解析
$("<xml><root><item></item></root></xml>").find("item").length;
解析xml内容:
示例xml:
<?xml version="1.0" encoding="utf-8" ?><fields> <field Name="Name1"><fieldname>dsname</fieldname><datatype>字符</datatype> </field> <field Name="Name2"><fieldname>dstype</fieldname><datatype>字符</datatype> </field></fields>
以下是解析示例代码:
$(xml).find("field").each(function() {var field = $(this);var fName = field.attr("Name");//读取节点属性var dataType = field.find("datatype").text();//读取子节点的值});
以上这篇JQuery解析XML数据的几个简单实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。