兼容IE和Firefox的数据岛方法

 

Using XML Data Islands in Mozilla

http://developer.mozilla.org/en/docs/Using_XML_Data_Islands_in_Mozilla

兼容IE和Firefox的数据岛方法
http://www.blogjava.net/BaSaRa/archive/2006/06/09/51710.html
首先，HTML页面：
<script type="text/javascript" src="xmlPathDemo.js"></script>
<h2>XML Order Database</h2>
<form>
 <table border="0">
  <tr>
   <td>SKU</td>
   <td><input type="text" name="SKU"></td>
  </tr>
  <tr>
   <td>Price</td>
   <td><input type="text" name="Price"></td>
  </tr>
  <tr>
   <td>Quantity</td>
   <td><input type="text" name="Quantity"></td>
  </tr>
  <tr>
   <td>Total</td>
   <td><input type="text" name="Total"></td>
  </tr>
  <tr>
   <td>Description</td>
   <td><input type="text" name="Description"></td>
  </tr>
 </table>
 <input type="button" value=" << " onClick="getDataPrev();">
 <input type="button" value=" >> " onClick="getDataNext();">
</form>

其次：一个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>

引用这个JS：
try{
 var i = -1;
 var orderDoc = new ActiveXObject("MSXML2.DOMDocument.3.0");
 orderDoc.load("order.xml");
 var items = orderDoc.selectNodes("/Order/Item");
}catch(e){}

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

function getDataNext() {
 i++;
 if (i > items.length - 1) i = 0;
 
 document.forms[0].SKU.value = getNode(orderDoc, "/Order/Item[" + i + "]/SKU");
 document.forms[0].Price.value = getNode(orderDoc, "/Order/Item[" + i + "]/PricePer");
 document.forms[0].Quantity.value = getNode(orderDoc, "/Order/Item[" + i + "]/Quantity");
 document.forms[0].Total.value = getNode(orderDoc,"/Order/Item[" + i + "]/Subtotal");
 document.forms[0].Description.value = getNode(orderDoc, "/Order/Item[" + i + "]/Description");
}

function getDataPrev() {
 i--;
 if (i < 0) i = items.length - 1;
 
 document.forms[0].SKU.value = getNode(orderDoc, "/Order/Item[" + i + "]/SKU");
 document.forms[0].Price.value = getNode(orderDoc,"/Order/Item[" + i + "]/PricePer");
 document.forms[0].Quantity.value = getNode(orderDoc, "/Order/Item[" + i + "]/Quantity");
 document.forms[0].Total.value = getNode(orderDoc,"/Order/Item["+ i + "]/Subtotal");
 document.forms[0].Description.value = getNode(orderDoc, "/Order/Item[" + i + "]/Description");
}  

window.onload = function() {
 getDataNext();
}

好了，运行看看，和IE的数据岛功能一样