Chinaunix首页 | 论坛 | 博客
  • 博客访问: 154700
  • 博文数量: 56
  • 博客积分: 1435
  • 博客等级: 上尉
  • 技术积分: 640
  • 用 户 组: 普通用户
  • 注册时间: 2008-11-26 09:58
文章分类

全部博文(56)

文章存档

2009年(52)

2008年(4)

我的朋友

分类: 系统运维

2009-03-17 15:26:41

先有一个XML数据:

Xml代码
  1. xml version="1.0" ?>  
  2. <Order>  
  3.   <Account>9900234Account>  
  4.   <Item id="1">  
  5.     <SKU>1234SKU>  
  6.     <PricePer>5.95PricePer>  
  7.     <Quantity>100Quantity>  
  8.     <Subtotal>595.00Subtotal>  
  9.     <Description>Super Widget ClampDescription>  
  10.   Item>  
  11.   <Item id="2">  
  12.     <SKU>6234SKU>  
  13.     <PricePer>22.00PricePer>  
  14.     <Quantity>10Quantity>  
  15.     <Subtotal>220.00Subtotal>  
  16.     <Description>Mighty Foobar FlangeDescription>  
  17.   Item>  
  18.   <Item id="3">  
  19.     <SKU>9982SKU>  
  20.     <PricePer>2.50PricePer>  
  21.     <Quantity>1000Quantity>  
  22.     <Subtotal>2500.00Subtotal>  
  23.     <Description>Deluxe DoohickieDescription>  
  24.   Item>  
  25.   <Item id="4">  
  26.     <SKU>3256SKU>  
  27.     <PricePer>389.00PricePer>  
  28.     <Quantity>1Quantity>  
  29.     <Subtotal>389.00Subtotal>  
  30.     <Description>Muckalucket BucketDescription>  
  31.   Item>  
  32.   <NumberItems>1111NumberItems>  
  33.   <Total>3704.00Total>  
  34.   <OrderDate>07/07/2002OrderDate>  
  35.   <OrderNumber>8876OrderNumber>  
  36. Order>  

然后把Item结点的数据读出。

相关的JS函数如下:

Js代码
  1. "javascript">  
  2.     var i = -1;  
  3.     var orderDoc = new ActiveXObject ("MSXML2.DOMDocument.3.0");  
  4.     orderDoc.load("order.xml");  
  5.     var items = orderDoc.documentElement.selectNodes("/Order/Item");  
  6.   
  7.     //获得结点文本  
  8.     function getNode(doc, xpath) {  
  9.       var retval = "";  
  10.       var value = doc.documentElement.selectSingleNode(xpath);  
  11.       if (value) retval = value.text;  
  12.       return retval;  
  13.     }  
  14.     //下一条记录  
  15.     function getDataNext() {  
  16.       i++;  
  17.       if (i > items.length - 1) i = 0;  
  18.   
  19.       document.forms[0].SKU.value = getNode(orderDoc, "/Order/Item[" + i + "]/SKU");  
  20.       document.forms[0].Price.value = getNode(orderDoc, "/Order/Item[" + i + "]/PricePer");  
  21.       document.forms[0].Quantity.value = getNode(orderDoc, "/Order/Item[" + i + "]/Quantity");  
  22.       document.forms[0].Total.value = getNode(orderDoc,"/Order/Item[" + i + "]/Subtotal");  
  23.       document.forms[0].Description.value = getNode(orderDoc, "/Order/Item[" + i + "]/Description");  
  24.     }  
  25.     //前一条记录  
  26.   
  27.     function getDataPrev() {  
  28.       i--;  
  29.       if (i < 0) i = items.length - 1;  
  30.         
  31.       document.forms[0].SKU.value = getNode(orderDoc, "/Order/Item[" + i + "]/SKU");  
  32.       document.forms[0].Price.value = getNode(orderDoc,"/Order/Item[" + i + "]/PricePer");  
  33.       document.forms[0].Quantity.value = getNode(orderDoc, "/Order/Item[" + i + "]/Quantity");  
  34.       document.forms[0].Total.value = getNode(orderDoc,"/Order/Item["+ i + "]/Subtotal");  
  35.       document.forms[0].Description.value = getNode(orderDoc, "/Order/Item[" + i + "]/Description");  
  36.     }  
  37.   

下面是测试网页代码:

Html代码
  1. <body onload="getDataNext()">  
  2. <form>  
  3.   <table border="0">  
  4.     <tr>  
  5.         <td>SKUtd>  
  6.         <td><input type="text" name="SKU">td>  
  7.     tr>  
  8.     <tr>  
  9.        <td>Pricetd>  
  10.        <td><input type="text" name="Price">td>  
  11.     tr>  
  12.     <tr>  
  13.         <td>Quantitytd>  
  14.         <td><input type="text" name="Quantity">td>  
  15.     tr>  
  16.     <tr>  
  17.         <td>Totaltd>  
  18.         <td><input type="text" name="Total">td>  
  19.     tr>  
  20.     <tr>  
  21.         <td>Descriptiontd>  
  22.         <td><input type="text" name="Description">td>  
  23.      tr>  
  24.   table>  
  25.     <input type="button" value="<<" onClick="getDataPrev()">  
  26.      <input type="button" value=">>" onClick="getDataNext()">  
  27.   form>  
  28. body> 
阅读(6423) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~