1.XML(eXtensible Markup Language)即可擴展標記語言,與HTML一樣,都是SGML標准通用語言。語法如下:
- 任何起始標簽都必須有一個結束標簽。
- 可以采用另一種簡化語法,即在一個標簽中同時表示起始和結束標簽。這種語法是在右邊閉合尖括號之前緊跟一個斜線(/),例如<tag/>。XML解析器會將其翻譯成<tag></tag>。
- 標簽必須按照合理的順序進行嵌套,因此結束標簽必須按鏡像順序匹配起始標簽。
- 所有屬性都需要有值,並且需要在值的周圍加上雙引號。
2.Content-Type:很多情況下XML文件不能征程解析都是由於Content-Type沒有設置好。如果Content-Type本身就是一個XML文件則不需要設置;如果是由后台程序動態生成的,那么就需要設置Content-Type為“text/xml”,否則jQuery會以默認的“text/html”方式處理,導致解析失敗,下面介紹幾種常見的語言中Content-Type的設置。
header("Content-Type : text/xml"); //PHP
response.ContentType = "text/xml"; //ASP
response.setContentType("text/xml"); //JSP
3.XML結構:作為一個標准的XML,必須要遵循嚴格的格式規定,其中最重要的一條規則就是XML必須是封閉的。XML文檔只能有一個頂層元素。下面展示一個正確的XML。
<?xml version="1.0" encoding="UTF-8"?> <stulist> <student email="1@1.com"> <name>zhangsan</name> <id>1</id> </student> <student email="2@2.com"> <name>lisi</name> <id>2</id> </student> </stulist>
4.獲取並解析XML,這里是通過Ajax函數進行讀取。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script> </head> <body> <input type="button" id="getXml" value="獲取和解析xml"/> <div id="load"></div> </body> <script type="text/javascript"> $(function(){ $("#getXml").click(function(){ $.ajax({ type:"get", url:"file/test.xml",//這里通過設置url屬性來獲取xml dataType:"xml", timeout:1000, //設定超時 cache:false, //禁用緩存 success:function(xml){//這里是解析xml var frag = $("<ul/>"); //建立一個代碼片段 $(xml).find("student").each(function(i){ var id = $(this).children("id"); //獲取id節點 id_value = id.text(); //獲取節點文本 email = $(this).attr("email"); //獲取student下的email屬性 //構造html字符串,通過append()方法添加到之前建立的代碼段 frag.append("<li>姓名:"+id_value+"---郵箱:"+email+"</li>"); }); frag.appendTo("#load"); } }); }) }) </script> </html>
5.效果展示,當我點擊“獲取和解析xml”按鈕時會在一個div里面添加一些html元素,里面的值就是xml文檔中的內容。