DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript綜合知識 >> JavaScript獲取XML內容
JavaScript獲取XML內容
編輯:JavaScript綜合知識     

 1、XML文件的內容WebForm5.xml

1 2 3 4 5 6 7 <?xml version="1.0" encoding="gb2312"?> <student> <id>123</id> <name>danny</name> <email>[email protected]</email> <date>20080901</date> </student>

2、創建XMLDOM對象實例獲取XML的內容

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>JS獲取XML內容</title> <script language="JavaScript"> var xmlDoc= new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async="false"; xmlDoc.load("WebForm5.xml"); root = xmlDoc.documentElement; //nodes = xmlDoc.documentElement.childNodes; document.all("id").innerText = root.childNodes.item(0).text; document.all("name").innerText = root.childNodes.item(1).text; document.all("email").innerText = root.childNodes.item(2).text; document.all("date").innerText = root.childNodes.item(3).text; </script> </head> <body> <form id="form1" runat="server"> <div> <b>編號: </b><span id="id"></span> <br> <b>姓名: </b><span id="name"></span> <br> <b>信箱: </b><span id="email"></span> <br> <b>日期:</b> <span id="date"></span> <br> </div> </form> </body> </html>

3、創建XMLHTTP對象實例獲取XML的內容

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 var xmlhttp; if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp = new XMLHttpRequest(); } else {   // code for IE6, IE5 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("GET", "WebForm5.xml", false); xmlhttp.send(); xmlDoc = xmlhttp.responseXML; var root = xmlDoc.getElementsByTagName("student"); for (i=0; i < root[0].childNodes.length; i++) { alert(root[0].childNodes.item(i).text); }
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved