使用JavaScript访问XML数据

在本篇文章中,我们将讲述如何在IE中使用ActiveX功能来访问并解析XML文档,由此允许网络冲浪者操纵它们。
这一网页将传入并运行脚本的初始化。你一定确保order.xml文档与jsxml.html在相同的相同的路径上。
初始化部分将一个新的ActiveX对象例示为MSXML2.DOMDocument.3.0对象类型,然后脚本传入order.xml文档到内存中,并选择所有的/Order/Item节点。我们使用/Order/Item节点以识别文档已经包含的选项。
文档中的标准有一个onLoad属性,这一属性能够使得网页调用getDataNext()而初始化。这一功能可用于从XML文档中获得下一个值并显示在表单中。我们使用一个简单的索引来访问特定的选项。
向前(>>)和向后(<<)按钮都使用相同的机制。首先响应onClick事件而调用getDataNext() 或者getDataPrev(),这两个函数使用了逻辑方法以避免文档以外的范围访问我们的记录。
1. [代码]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>
2. [代码]order.html     
<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>css3教程
  <input type="button" value="  <<  " onClick="getDataPrev();">
  <input type="button" value="  >>  " onClick="getDataNext();">
</form>
3. [代码]jsxml.html     
<html>
  <head>
    <script language="JavaScript">
<!--
    vari = -1;
    varorderDoc = new ActiveXObject("MSXML2.DOMDocument.3.0");
    orderDoc.load("order.xml");
    var items = orderDoc.selectNodes("/Order/Item");
       
    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");
    }
   
// -->
    </script>
  </head>
  <body >
  <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>http://www.huiyi8.com/css3/?
<input type="button" value="  <<  " onClick="getDataPrev();">  <input type="button" value="  >>  " onClick="getDataNext();">
?  </form> 
  </body>
</html>

使用JavaScript访问XML数据

时间: 2024-07-30 13:04:05

使用JavaScript访问XML数据的相关文章

以对象的方式来访问xml数据表(二)

为什么要以对象的方式来访问xml数据表? 还记得,自己是在一次完成师兄布置的任务时接触到了xml,那时候需要用xml来作为数据文件,保存一个简单的图书管理系统的数据.于是就知道了,可以用xml文件来保存数据(而且比用简单的文本文件保存数据规范的多,在访问与读取数据上面都十分方便),就这样使用xml的征程开始了. 自己做的第一个WPF桌面应用程序——备忘录,就是用xml文件作为数据库.而且那个时候考虑到以后可能会经常使用到xml文件作为数据库,于是乎就写了一个专门用于访问xml文件的动态链接库,这

以对象的方式来访问xml数据表(三)

怎样以对象的方式来访问xml数据表? 在讲如何具体实现(二)中所说的专门用于访问xml文件的动态链接库之前,我们先来看看这个动态链接库具体要实现什么功能. 动态链接库IXmlDB.dll的功能: 1.对于不同的对象具有通用性.(简单地说就是在不修改内部代码的情况下,可以用不同的对象去映射不同的xml数据表) 由于数据保存在xml数据表里,所有数据都是以字符串的形式保存的,那么与之对应的对象里的属性就可以全部统一为string类型. 类与xml数据表映射的两个实例代码: User类与其对应xml数

Ajax跨域访问XML数据的另一种方式——使用YQL查询语句

XML数据默认是不能在客户端通过Ajax跨域请求读取的,一般的做法是在服务器上写一个简单的代理程序,将远程XML的数据先读到本地服务器,然后客户端再从本地服务器通过Ajax来请求.由于我们不能对数据源所在的环境进行任何设置和修改,所以仅通过客户端代码很难绕过这个问题.但如果请求的数据不是XML而是JSON对象或者JavaScript函数,则通过JSONP方法可以非常容易地解决,直接调用JQuery.getJSON()方法在回调函数中就可以获取到返回的结果.如果要使用JSONP,可以在指定的URL

XML数据岛

XML数据岛技术是微软IE5开始支持的数据源技术,其他浏览器不支持,所以它不能跨浏览器.它是在DSO(Data Source Object)技术基础上的一种扩展,有效的实现了HTML和XML的优势互补.可以很好的把对称的XML的数据展示在HTML上. 1. 主要有两种方式实现xml载入: 内嵌 在页面文件中的<head></head>或者<body></body>之间嵌入如下格式,其中id必须在页面上是唯一的标识,encoding是字符集 <xml i

160928、JQuery解析XML数据的demo

用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 方案1 当后台返回的数据类型是xml对象,如下: 那么,前端jquery解析: 就会得到"成功!"这个文字信息. 方案2 当你要解析一个xml文件对象时候,如xmlfile.xml: $.get("xmlfile.xml",function(xml){ $(xml).find("item"

手把手教你SOAP访问webservice并DOM解析返回的XML数据(转)

http://blog.csdn.net/u012534831/article/details/51357111 前言: 目前我们项目组还在采用webservice这种http方式,并且某些网站服务提供的对外接口还在采用webservice方式,因此就总结了一下写了这篇文章. 以soap1.2的请求为例,在例子里我们传进去用户名和密码给服务,服务返回一个xml数据. 首先我们来开一下soap1.2的request, //wsdl,例:OrderApp.asmx POST /******App.a

javascript读取xml文件读取节点数据的例子

分享下用javascript读取xml文件读取节点数据方法. 读取的节点数据,还有一种情况是读取节点属性数据. <head> <title></title> <script type="text/javascript"> var objLength = null; var xmlHttp; var strurl = ""; function ajaxrequst() { if (window.ActiveXObject

手把手教你SOAP访问webservice并DOM解析返回的XML数据

前言: 目前我们项目组还在采用webservice这种http方式,并且某些网站服务提供的对外接口还在采用webservice方式,因此就总结了一下写了这篇文章. 以soap1.2的请求为例,在例子里我们传进去用户名和密码给服务,服务返回一个xml数据. 首先我们来开一下soap1.2的request, //wsdl,例:OrderApp.asmx POST /******App.asmx HTTP/1.1 //这儿填写服务地址 Host: 100.100.100.100 Content-Typ

XML数据岛,数据绑定参考

1.XML的局限性 目前,许多Web网站的内容数据都存放在数据库或数据文件中.对于Web程序开发人员来说,如果要想把有用的信息从数据库中提取出来,传统的方法是在服务器端编写脚本程序(如VBScript.JavaScript.CGI.ASP.JSP,Perl等等),通过对数据库执行SQL查询得到相关记录,然后把查询结果组织成HTML页面返回给客户端,用户使用浏览器观察最终结果. 为了提高系统服务的灵活性.可扩展性,使服务对象范围更广,许多商业网站都尽可能地把商务规则.原始数据和表现形式当做相互独立