<?xml version="1.0"?>
<note>
<to>George</to>
<from>John</from>
<heading>Reminder</heading>
<body>Don't forget the meeting!</body>
<lastname>Simth</lastname>
</note>
<html> <head> <script type="text/javascript"> function parseXML(){ try{ xmlDoc= new ActiveXObject("Microsoft.XMLDOM"); }catch(e){ try{ xmlDoc= document.implementation.createDocument("","",null); }catch(e){ alert(e.message); return; } } xmlDoc.async = false; xmlDoc.load("../xml/test.xml"); document.getElementById("to").innerHTML=xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue; document.getElementById("from").innerHTML=xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue; document.getElementById("message").innerHTML=xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue; } </script> </head> <body onload="parseXML()"> <h1>W3School.com.cn Internal Note</h1> <p><b>To:</b><span id="to"></span><br/> <b>From:</b><span id="from"></span><br/> <b>Message:</b><span id="message"></span> <p> </body> </html>
jquery 解析xmljavascript
<?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>
<!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>