<?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 解析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>
<!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>