JQuery解析xml的兩種方式$.get和$.ajax

首先,要讓jQuery加載xml文件,如下,有兩種方式:

第一種$.get:

  1. $.get("xmlfile.xml",function(xml){  
  2.     //xml即爲可以讀取使用的內容
  3. });  

第二種$.ajax:

  1. <script type="text/javascript">  
  2. $(document).ready(function() {  
  3.     $.ajax({  
  4.         url: 'http://www.nowamagic.net/cgi/test.xml',  
  5.         dataType: 'xml',  
  6.         success: function(data){  
  7.             //console.log(data);  
  8.             $(data).find("channel").find("item").each(function(index, ele) {  
  9.                 var titles = $(ele).find("title").text();  
  10.                 var links = $(ele).find("link").text();  
  11.                 console.log(titles+'-----');  
  12.                 $("#noticecon").find('ol').append('<li><a href="'+links+'">'+titles+'</a></li>');  
  13.             });  
  14.         }  
  15.     });  
  16. })   
  17. </script>  
  18.   
  19.     <div id="noticecon">  
  20.         <ol>  
  21.         </ol>  
  22.     </div>  

加載完,之後,就可以開始解析xml了,如下:

xml文件:

  1. <?xml version="1.0" encoding="utf-8" ?>  
  2. <fields>  
  3.   <field Name="Name1">  
  4.     <fieldname>dsname</fieldname>  
  5.     <datatype>字符</datatype>  
  6.   </field>  
  7.   <field Name="Name2">  
  8.     <fieldname>dstype</fieldname>  
  9.     <datatype>字符</datatype>  
  10.   </field>  
  11. </fields>  

解析代碼:

[html] view plain copy
  1. $(xml).find("field").each(function() {  
  2.     var field = $(this);  
  3.     var fName = field.attr("Name");//讀取節點屬性  
  4.     var dataType = field.find("datatype").text();//讀取子節點的值  
  5. });  


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章