您的位置：首页 > Web前端 > JavaScript

兼容IE和Firefox的JS读取XML文档例子

2009-07-28 07:48 666 查看

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>兼容IE和Firefox的JS读取XML文档</title>
</head>

<body>
<mce:script language="JavaScript"><!--
var i=0;
var orderDoc;
var items;

if (window.ActiveXObject){
var orderDoc = new ActiveXObject("Microsoft.XMLDOM"); //IE
} else {
if (document.implementation && document.implementation.createDocument) {//Firefox
var orderDoc = document.implementation.createDocument("","doc",null);

XMLDocument.prototype.selectSingleNode = Element.prototype.selectSingleNode = function (xpath){
var  x = this.selectNodes(xpath)
if ( ! x || x.length < 1 ) return   null ;
return  x[ 0 ];
}
XMLDocument.prototype.selectNodes = Element.prototype.selectNodes = function (xpath){
var xpe = new XPathEvaluator();
var nsResolver = xpe.createNSResolver( this.ownerDocument == null ?
this.documentElement : this.ownerDocument.documentElement);
var result = xpe.evaluate(xpath, this , nsResolver, 0 , null );
var found = [];
var res;
while (res = result.iterateNext()){
res.text = res.textContent;
found.push(res);
}
return  found;
}
}
}

orderDoc.async=false;
orderDoc.load("order.xml");
items = orderDoc.selectNodes("/Order/Item");

function getNode(doc, xpath) {
var value = doc.selectSingleNode(xpath);
if (value) retval = value.text;
return retval;
}

function getDataNext() {
i++;
if (i > items.length) {i = 1};

document.getElementById("SKU").value = getNode(orderDoc, "/Order/Item[@id=" + i + "]/SKU");
document.getElementById("Price").value = getNode(orderDoc, "/Order/Item[@id=" + i + "]/PricePer");
document.getElementById("Quantity").value = getNode(orderDoc, "/Order/Item[@id=" + i + "]/Quantity");
document.getElementById("Total").value = getNode(orderDoc,"/Order/Item[@id=" + i + "]/Subtotal");
document.getElementById("Description").value = getNode(orderDoc, "/Order/Item[@id=" + i + "]/Description");
}

function getDataPrev() {
i--;
if (i < 1) i = items.length;

document.getElementById("SKU").value = getNode(orderDoc, "/Order/Item[@id=" + i + "]/SKU");
document.getElementById("Price").value = getNode(orderDoc,"/Order/Item[@id=" + i + "]/PricePer");
document.getElementById("Quantity").value = getNode(orderDoc, "/Order/Item[@id=" + i + "]/Quantity");
document.getElementById("Total").value = getNode(orderDoc,"/Order/Item[@id="+ i + "]/Subtotal");
document.getElementById("Description").value = getNode(orderDoc, "/Order/Item[@id=" + i + "]/Description");
}
// --></mce:script>
<h2>XML Order Database</h2>
<form>
<table border="0">
<tr><td>SKU</td><td><input type="text" name="SKU" id="SKU"></td></tr>
<tr><td>Price</td><td><input type="text" name="Price" id="Price"></td></tr>
<tr><td>Quantity</td><td><input type="text" name="Quantity" id="Quantity"></td></tr>
<tr><td>Total</td><td><input type="text" name="Total" id="Total"></td></tr>
<tr><td>Description</td><td><input type="text" name="Description" id="Description"></td></tr>
</table>
<input type="button" value="  <<  " onClick="getDataPrev();">  <input type="button" value="  >>  " onClick="getDataNext();">
</form>
</body>
</html>

order.xml

<?xml version="1.0" ?>
<Order>
<Account>9900234</Account>
<Item id="1">
<SKU>1234</SKU>
<PricePer>5.95</PricePer>
<Quantity>100</Quantity>
<Subtotal>595.00</Subtotal>
<Description>Super Widget Clamp</Description>
</Item>
<Item id="2">
<SKU>6234</SKU>
<PricePer>22.00</PricePer>
<Quantity>10</Quantity>
<Subtotal>220.00</Subtotal>
<Description>Mighty Foobar Flange</Description>
</Item>
<Item id="3">
<SKU>9982</SKU>
<PricePer>2.50</PricePer>
<Quantity>1000</Quantity>
<Subtotal>2500.00</Subtotal>
<Description>Deluxe Doohickie</Description>
</Item>
<Item id="4">
<SKU>3256</SKU>
<PricePer>389.00</PricePer>
<Quantity>1</Quantity>
<Subtotal>389.00</Subtotal>
<Description>Muckalucket Bucket</Description>
</Item>
<NumberItems>1111</NumberItems>
<Total>3704.00</Total>
<OrderDate>07/07/2002</OrderDate>
<OrderNumber>8876</OrderNumber>
</Order>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航