javascript讀取xml檔案
來源：互聯網
上載者：User
核心部分 <%@ page language="java" import="java.util.*" pageEncoding="GBK"%> <script language="javascript"> //建立Dom對象 function createDocument() { var aVersions = ["MSXML2.DOMDocument.5.0", "MSXML2.DOMDocument.4.0", "MSXML2.DOMDocument.3.0", "MSXML2.DOMDocument", "Microsoft.XmlDom" ]; for (var i = 0; i < aVersions.length; i++) { try { var oXmlDom = new ActiveXObject(aVersions[i]); return oXmlDom; } catch (oError) { } } throw new Error("MSXML is not installed."); } function init() { var oXmlDom = createDocument(); oXmlDom.async = true; oXmlDom.onreadystatechange = function () { if (oXmlDom.readyState == 4) { if (oXmlDom.parseError.errorCode == 0) { parseBookInfo(oXmlDom); }else{ var str = "An error occurred!!/n" + "Description: " + oXmlDom.parseError.reason + "/n" + "File: " + oXmlDom.parseError.url + "/n" + "Line: " + oXmlDom.parseError.line + "/n" + "Line Position: " + oXmlDom.parseError.linePos + "/n" + "Source Code: " + oXmlDom.parseError.srcText; alert(str); } } }; oXmlDom.load("books.xml"); } //文檔解析 function parseBookInfo(oXmlDom) { var oRoot = oXmlDom.documentElement; var oFragment = document.createDocumentFragment(); var aBooks = oRoot.getElementsByTagName("book"); //遍曆產生每個資訊 for (var i = 0; i < aBooks.length; i++) { var sIsbn = aBooks[i].getAttribute("isbn"); var sAuthor, sTitle, sPublisher; var oCurrentChild = aBooks[i].firstChild; do { switch (oCurrentChild.tagName) { case "title":sTitle = oCurrentChild.text; break; case "author":sAuthor = oCurrentChild.text; break; case "publisher":sPublisher = oCurrentChild.text; break; default: break; } }while(oCurrentChildoCurrentChild = oCurrentChild.nextSibling); //---------------產生顯示頁面-------------- //產生每個xml元素的基本容器 var divContainer = document.createElement("div"); var imgBookCover = document.createElement("img"); var divContent = document.createElement("div"); var sOdd = (i % 2)?"":"-odd"; divContainer.className = "bookContainer" + sOdd; //封面資訊 imgBookCover.src = "images/" + sIsbn + ".jpg"; imgBookCover.className = "bookCover"; divContainer.appendChild(imgBookCover); //標題 var h3Title = document.createElement("h3"); h3Title.appendChild(document.createTextNode(sTitle)); divContent.appendChild(h3Title); //作者 divContent.appendChild(document.createTextNode("Written by: " + sAuthor)); divContent.appendChild(document.createElement("br")); divContent.appendChild(document.createTextNode("ISBN: #" + sIsbn)); //出版社 var divPublisher = document.createElement("div"); divPublisher.className = "bookPublisher"; divPublisher.appendChild(document.createTextNode("Published by: " + sPublisher)); divContent.appendChild(divPublisher); //組裝 divContent.className = "bookContent"; divContainer.appendChild(divContent); oFragment.appendChild(divContainer); document.body.appendChild(oFragment); } } </script> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>Book XML Exercise</title> <link rel="stylesheet" type="text/css" href="books.css" /> <script type="text/javascript" src="zxml.js"></script> </head> <body onload="init()"> </body> </html> books.xml <?xml version="1.0" encoding="utf-8"?> <bookList> <book isbn="0471777781"> <title>Professional Ajax</title> <author>Nicholas C. Zakas, Jeremy McPeak, Joe Fawcett</author> <publisher>Wrox</publisher> </book> <book isbn="0764579088"> <title>Professional JavaScript for Web Developers</title> <author>Nicholas C. Zakas</author> <publisher>Wrox</publisher> </book> <book isbn="0764557599"> <title>Professional C#</title> <author>Simon Robinson, et al</author> <publisher>Wrox</publisher> </book> <book isbn="1861006314"> <title>GDI+ Programming: Creating Custom Controls Using C#</title> <author>Eric White</author> <publisher>Wrox</publisher> </book> <book isbn="1861002025"> <title>Professional Visual Basic 6 Databases</title> <author>Charles Williams</author> <publisher>Wrox</publisher> </book> </bookList> css body{ font-size:12px; text-align:left; } div{ } .bookContainer-odd{ background-color:#CCCCFF; border:1px solid #000000; padding:5px; margin:5px; width:600px; } .bookContainer{ background-color:#CC99FF; border:1px solid #000000; padding:5px; margin:5px; width:600px; } .bookCover{ max-height:160px; max-width:200px; border:none; }
