zl程序教程

您现在的位置是:首页 >  前端

当前栏目

jquery解析xml字符串示例分享

jQueryXML 解析 字符串 分享 示例 jQuery xml
2023-06-13 09:15:24 时间

第一种方案:

复制代码代码如下:


<scripttype="text/javascript">
$(document).ready(function(){
 $.ajax({
   url:"http://www.test.net/cgi/test.xml",
   dataType:"xml",
   success:function(data){
    //console.log(data);
   $(data).find("channel").find("item").each(function(index,ele){
    vartitles=$(ele).find("title").text();
    varlinks=$(ele).find("link").text();
    console.log(titles+"-----");
    $("#noticecon").find("ol").append("<li><ahref=""+links+"">"+titles+"</a></li>");
   });
  }
 });
})
</script>
   <divid="noticecon">
  <ol>
  </ol>
 </div>


第二种方案:

复制代码代码如下:


<scripttype="text/javascript">
 $.get("http://www.test.net/cgi/test.xml",function(data){
  $(data).find("channel").find("item").each(function(index,ele){
   vartitles=$(ele).find("title").text();
   varlinks=$(ele).find("link").text();
   $("#noticecon").find("ol").append("<li><ahref=""+links+"">"+titles+"</a></li>");
  })
 });
</script>
   <divid="noticecon">
  <ol>
  </ol>
 </div>


一般步骤如下:

1.读取xml文件

复制代码代码如下:
$.get("xmlfile.xml",function(xml){   
 $(xml).find("item").length;   
});

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:

复制代码代码如下:
<?xmlversion="1.0"encoding="utf-8"?>
<fields>
 <fieldName="Name1">
   <fieldname>dsname</fieldname>
   <datatype>字符</datatype>
 </field>
 <fieldName="Name2">
   <fieldname>dstype</fieldname>
   <datatype>字符</datatype>
 </field>
</fields>

以下是解析示例代码:

复制代码代码如下:
$(xml).find("field").each(function(){
 varfield=$(this);
 varfName=field.attr("Name");//读取节点属性
 vardataType=field.find("datatype").text();//读取子节点的值
});