跨浏览器的XML接口的实现

维普资讯

・７２・　（总６９８）　跨浏览器的ＸＭＬ接口的实现　２００７盔　

跨浏览器的ＸＭＬ接口的实现　

广州大学　陈畅频　郭四稳　

ＸＭＬ是从ＳＧＭＬ衍生出来的通用　技术。创建ＸＭＬ文档的标准方式由Ｄ０Ｍ　

ｒｅｔｕｒｎ　ｎｅｗ　ＡｃｔｉｖｅＸＯｂｊｅｃｔ　

ｘ（）＋　．ＸｍｌＨｔｔｐ　）；｝｝　

ｍｐｌｅｍｅｎｔａｔｉｏｎ　

（ｇｅｔＣ０ｎｔｒ０ｌＰｒｅｆｉ

标记语言，是创建标记语言的元语言。　

级别２引入，它使用ＤＯＭＩ

ｅａｔｅＤｏｃｕｍｅｎｔ方法。　

ＸＭＬ结构化地表示信息，并支持网络跨　

接口的ｃｒ

ｃａｔｃｈ（ｅｘ）｛）　

平台应用和数据交换。　

ｄｏｃｕｍｅｎｔ．ｉｍｐｌｅｍｅｎｔａｔｉｏｎ．ｃｒｅａｔｅＤｏｃ　

ｔｈｒｏｗ　ｎｅｗ　Ｅｒｒｏｒ（”您的浏览器不支　

ｆｉｅｄＮａｍｅ，　

持ＸｍｌＨｔｔｐ对象　）；）；　

文档对象模型（Ｄｏｃｕｍｅｎｔ　Ｏｂｊｅｃｔ　

ｕｍｅｎｔ（ｓＮａｍｅＳｐａｃｅＵｒｉ，ｓＱｕａｌｉ

Ｍｏｄｅｌ，Ｄ０Ｍ）定义了访问和操作ＸＭＬ文　

ｏＤｏｃｔｙｐｅ）；

如果将来Ｍｏｚｉｌｌａ本身提供了对　

档的标准方式，是操纵ＸＭＬ的最常用工　

这样就创建了一个ＸｍｌＤｏｃｕｍｅｎｔ对　

ｏｎｒｅａｄｙｓｔａｔｅｃｈａｎｇｅ事件的支持，则上述　

具之一。由ＤＯＭ创建的节点树是ＸＭＬ　

文件内容的逻辑表示，它显示了文件提供　

的信息以及他们之间的关系。ＤＯＭ现在　

不仅内置于Ｗｅｂ浏览器，而且也成为许　

多基于ＸＭＬ的规范的一部分。　

ＸｍｌＨｔｔｐ提供客户端同ｈｔｔｐ服务器　

通讯的协议。客户端可以通过ＸｍｌＨｔｔｐ对　

象向ｈｔｔｐ服务器发送请求并使用ＤＯＭ　

处理回应。现在的绝对多数浏览器都增加　

了对ＸｍｌＨｔｔｐ的支持，ＩＥ中使用　

ＡｃｔｉｖｅＸＯｂｊｅｃｔ方式创建ＸｍｌＨｔｔｐ对象，　

其他浏览器：如Ｍｏｚｉｌｌａ通过Ｆｉｒｅｆｏｘ、　

Ｏｐｅｒａ等通过ｗｉｎｄｏｗ．ＸＭＬＨｔｔｐＲｅｑｕｅｓｔ　

来创建ＸｍｌＨｔｔｐ对象。　

本文将详细讲述在ＩＥ和Ｍｏｚｉｌｌａ中　

如何创建ＸｍｌｏＤｃｕｍｅｎｔ对象和ＸｍｌＨｔｔｐ　

对象来操纵ＸＭＬ并同ＨＴＴＰ服务器交　

互。　

ｌ浏览器对ＸＭＬ的支持　

１．１　ＩＥ对ＸＭＬ的支持　

有两个被标记成脚本安全的ＡｃｔｉｖｅＸ　

对象可以在ＩＥ中使用。这些对象使用　

ＭＳＸＭＬ解析器，创建方法如下：　

ｖａｒ　ｘｍｌＤｏｃｕｍｅｎｔ　—　ｎｅｗ　

ＡｃｔｉｖｅＸＯｂｊｅｃｔ（“ＭｓＸｍｌ２．ＸｍｌＤｏｍ”）；　

ｖａｒ　ｘｍｌＨｔｔｐ－二ｎｅｗ　ＡｃｔｉｖｅＸＯｂｊｅｃｔ　

（“ＭｓＸｍｌ２．ＸｍｌＨｔｔｐ”）；　

第一个对象代表ＸＭＬ文档，它允许　

你使用标准的ＤＯＭ１核心方法向文档添　

加新的结点。该对象也提供了另外一些方　

法来支持从文件或字符串装入（获取）　

ＸＭＬ文档。　

第二个对象允许将ＸＭＬ文档发送到　

服务器，且来自服务器的回复也会发回到　

该ＸＭＬ　ＨＴＴＰ请求对象。这使得不需要　

离开当前页面就可以发送ＸＭＬ数据到服　

务器。　

１．２　Ｍｏｚｉｌｌａ对ＸＭＬ的支持　

Ｍｏｚｉｌｌａ尽可能使用与Ｗ３Ｃ兼容的　

象并且可以用使用Ｍｏｚｉｌｌａ支持的任何　的静态方法将只检查浏览器支持并使用　

Ｄ０Ｍ（级别１、２和３）方法。　

浏览器支持的机制来创建所需的对象实　

下面是一个最简单的例子　例。如果当前版本的Ｍｏｚｉｌｌａ不支持　

ｄｏｃｕｍｅｎｔ．ｉｍｐｌｅｍｅｎｔａｔｉｏｎ．ｃｒｅａｔｅＤｏ　

ｒｅａｄｙＳｔａｔｅ属性，则也一定不支持　

ｃｕｍｅｎｔ（…，，…　，ｎｕｌ１）；　

ｏｎｒｅａｄｙｓｔａｔｅｃｈａｎｇｅ事件，于是需要监听　

Ｍｏｚｉｌｌａ支持ＸＭＬＨｔｔｐＲｅｑｕｅｓｔ对　

ｏｎｌｏａｄ事件并且在事件发生时调用用户　

象。下面的代码用于创建ＸＭＬ　ｈｔｔｐ请求　

提供的处理器（如果有的话）。　

对象。　

２．２　ＸｍｌＤｏｃｕｍｅｎｔ　

ｎｅｗ　ＸＭＬＨｔｔｐＲｅｑｕｅｓｔ（）　

ｆｕｎｃｔｉｏｎ　ＸｍｌＤｏｃｕｍｅｎｔ（）｛｝　

２通用的ＸＭＬ接口　

ＸｍｌＤｏｃｕｍｅｎｔ．ｃｒｅａｔｅ—ｆｕｎｃｔｉｏｎ（）　

为了方便在不同的浏览器中使用　

｛　

ＸＭＬ，这里创建两个工厂类，分别叫做　

ｔｒｙ｛　

ＸｍｌＨｔｔｐ和ＸｍｌＤｏｃｕｍｅｎｔ。这两个类都有　

ｉｆ（ｄｏｃｕｍｅｎｔ．ｉｍｐｌｅｍｅｎｔａｔｉｏｎ　

名为ｃｒｅａｔｅ的静态方法（类方法，共享方　

＆＆　

法），它创建正确类型的实例对象。　

ｄｏｃｕｍｅｎｔ．ｉｍｐｌｅｍｅｎｔａｔｉｏｎ．ｃｒｅａｔｅＤｏｃｕｍｅ　

ｖａｒ　ｘｍｌＤｏｃｕｍｅｎｔ　—　

ｎｔ）　

ＸｍｌＤｏｃｕｍｅｎｔ．ｃｒｅａｔｅ（）；　

｛　

ｖａｒ　ｘｍｌＨｔｔｐ＝ＸｍｌＨｔｔｐ．ｃｒｅａｔｅ（）；　

ｖａｒ　ｄｏｃ　二－　

２．１　ＸｍｌＨｔｔｐ　

ｄｏｃｕｍｅｎｔ．ｉｍｐｌｅｍｅｎｔａｔｉｏｎ．ｃｒｅａｔｅＤｏｃｕｍｅ　

ｆｕｎｃｔｉｏｎ　ＸｍｌＨｔｔｐ（）｛｝　

ｎｔ（　，　，ｎｕｌ１）；　

ＸｍｌＨｔｔｐ．ｃｒｅａｔｅ－二ｆｕｎｃｔｉｏｎ（）｛　

ｉｆ（ｄｏｃ．ｒｅａｄｙＳｔａｔｅ－二－二ｎｕｌ１）　

ｔｒｙ｛　

｛　

ｉｆ（ｗｉｎｄｏｗ．ＸＭＬＨｔｔｐＲｅｑｕｅｓｔ）　

ｄｏｃ．ｒｅａｄｙＳｔａｔｅ－二１：　

｛　

ｄｏｃ．ａｄｄＥｖｅｎｔＬｉｓｔｅｎｅｒ（　

ｖａｒ　ｒｅｑ　二。　ｎｅｗ　

ｌｏａｄ　。ｆｕｎｃｔｉｏｎ（）｛　

ＸＭＬＨｔｔｐＲｅｑｕｅｓｔ（）；　

ｄｏｃ．ｒｅａｄｙＳｔａｔｅ一４；　

ｉｆ（ｒｅｑ．ｒｅａｄｙＳｔａｔｅ－二－二ｎｕｌ１）　

ｉｆ　（ｔｙｐｅｏｆ　

｛　

ｄｏｃ．ｏｎｒｅａｄｙｓｔａｔｅｃｈａｎｇｅ－二－二　ｆｕｎｃｔｉｏｎ　）　

ｒｅｑ．ｒｅａｄｙＳｔａｔｅ一１：　

ｒｅｑ．ａｄｄＥｖｅｎｔＬｉｓｔｅｎｅｒ‘（　

ｄｏｃ．ｏｎｒｅａｄｙｓｔａｔｅｃｈａｎｇｅ（）；　

ｌｏａｄ　，ｆｕｎｃｔｉｏｎ（）｛　

），ｆａｌｓｅ）；）　

ｒｅｑ．ｒｅａｄｙＳｔａｔｅ－二４：　

ｒｅｔｕｒｎ　ｄｏｃ；）　

ｉｆ　（ｔｙｐｅｏｆ　

ｉｆ（ｗｉｎｄｏｗ．ＡｃｔｉｖｅＸＯｂｊｅｃｔ）　

ｒｅｑ．ｏｎｒｅａｄｙｓｔａｔｅｃｈａｎｇｅ一－二　ｆｕｎｃｔｉｏｎ　）　

ｒｅｔｕｒｎ　ｎｅｗ　ＡｃｔｉｖｅＸＯｂｊｅｃｔ　

（ｇｅｔＣｏｎｔｒｏ１Ｐｒｅｆｉｘ（）＋”．ＸｍｌｏＤｍ　）；）　

ｒｅｑ．ｏｎｒｅａｄｙｓｔａｔｅｃｈａｎｇｅ（）；　

ｃａｔｃｈ（ｅｘ）｛）　

），ｆａｌｓｅ）；）　

ｔｈｒｏｗ　ｎｅｗ　Ｅｒｒｏｒ（”您的浏览器不支　

ｒｅｔｕｒｎ　ｒｅｑ；｝　

持ＸｍｌＤｏｃｕｍｅｎｔ对象”）；）；　

ｉｆ（ｗｉｎｄｏｗ．ＡｃｔｉｖｅＸＯｂｊｅｃｔ）｛　

为了支持ｏｎｒｅａｄｙｓｔａｔｅｃｈａｎｇｅ事件，　

维普资讯

第２Ｏ卷第９期　电脑开发与应用　

这里也做了一些额外的处理。但除此之　／／将字符串解析成新的文档　

定采用异步还是同步方式。异步方式下客　

外，ｃｒｅａｔｅ方法的实现应当是很直观的。　

ｖａｒ　ｄｏｃ２一（ｎｅｗ　ＤＯＭＰａｒｓｅｒ（））　

户端不需要等待服务器的响应，而是由浏　

２．３　ｇｅｔＣｏｎｔｒｏｌＰｒｅｆｉｘ　

．

ｐａｒｓｅＦｒｏｍＳｔｒｉｎｇ（ｓ，”ｔｅｘｔ／ｘｍｌ”）；　

览器在有响应时自动调用指定的回调函　

不同版本的ＩＥ和Ｗｉｎｄｏｗｓ安装了不　／／删除所有原来的子元素　数（如这里的ｄｏＳｏｍｅｔｈｉｎｇ）。　

同版本的ＭＳＸＭＬ解析器，因此需要创建　

ｗｈｉｌｅ（ｔｈｉｓ．ｈａｓＣｈｉｌｄＮｏｄｅｓ（））　

②使用同步ＸｍｌＨｔｔｐ　

一

个帮助函数来检测对用户所用ＩＥ版本　

ｔｈｉｓ．ｒｅｍｏｖｅＣｈｉｌｄ　

同步方式更容易使用，因为在服务器　

起作用的控件的前缀。这个函数试着一次　

（ｔｈｉｓ．１ａｓｔＣｈｉｌｄ）；　

做出响应之前对ｓｅｎｄ的调用不会返回，　

性创建“ＸｍｌＨｔｔｐ”和“ＸｍｌＤｏｍ”两个　

？？插入并导人结　

而且浏览器在此期间也不会做其它事情。　

ＡｃｔｉｖｅＸ对象，并且一发现起作用的前缀　

ｆｏｒ　（ｖａｒ　ｉ　一０；　ｉ　＜　

如果希望使用同步方式，则需要将ｏｐｅｎ　

就记录下来，以避免重试。如果没有发现　

ｄｏｃ２．ｃｈｉｌｄＮｏｄｅｓ．１ｅｎｇｔｈ；ｉ＋＋）｛　

的第３个参数设置成ｆａｌｓｅ。一旦ｓｅｎｄ方　

有效的控件前缀则抛出异常。版本无关的　

ｔｈｉｓ．ａｐｐｅｎｄＣｈｉｌｄ　

法调用完毕，就可以访问ｒｅｓｐｏｎｓｅＸＭＬ　

控件前缀是“ＭＳＸＭＬ２”，这也是首先要测　

（ｔｈｉｓ．ｉｍｐｏｒｔＮｏｄｅ（ｄｏｃ２．ｃｈｉｌｄＮｏｄｅｓ［ｉ］，　

属性了。　

试的前缀。在它之后，其他一些前缀也被　

ｔｒｕｅ））；））；　

ｆｕｎｃｔｉｏｎ　ｌｏａｄＳｙｎｃ（ｓＵｒｉ）ｆ　

测试。　Ｍｏｚｉｌｌａ版本的ＸＭＬ文档缺少的　

ｖａｒ　ｘｍｌＨｔｔｐ—ＸｍｌＨｔｔｐ－ｃｒｅａｔｅ　

ｆｕｎｃｔｉｏｎ　ｇｅｔＣｏｎｔｒｏ１Ｐｒｅｆｉｘ（）｛　

一

个更重要的特性是将Ｄ０Ｍ树串行化　

（）；　

ｉｆ（ｇｅｔＣｏｎｔｒｏ１Ｐｒｅｆｉｘ．ｐｒｅｆｉｘ）　

成ＸＭＬ字符串。幸运的是，可以使用名为　

ｘｍｌＨｔｔｐ．ｏｐｅｎ（”ＧＥＴ”，ｓＵｒｉ，　

ｒｅｔｕｒｎ　ｇｅｔＣｏｎｔｒｏ１Ｐｒｅｆｉｘ．ｐｒｅｆｉｘ；　

ＸＭＬＳｅｒｉａｌｉｚｅｒ的类来做此事。在ＩＥ中，　

ｆａｌｓｅ）；　

ｖａｒ　ｐｒｅｆｉｘｅｓ—ｒ”ＭＳＸＭＬ２”。”　

ＸＭＬ文档有一个名为ｘｍｌ的属性，它将　

ｘｍｌＨｔｔｐ．ｓｅｎｄ（ｎｕｌ１）；　

Ｍｉｃｒｏｓｏｆｔ”，”ＭＳＸＭＬ”，”ＭＳＸＭＬ３＂］；　

ＤＯＭ树串行化成ＸＭＬ字符串，于是在　

ｄｏＳ０ｍｅｔｈｉｎｇ　

ｖａｒ　０，０２；　

Ｄｏｃｕｍｅｎｔ．ｐｒｏｔｏｔｙｐｅ上定义一个返回　

（ｘｍｌＨｔｔｐ．ｒｅｓｐｏｎｓｅＸＭＬ　）；　／／　

ｆｏｒ　（ｖａｒ　ｉ　一０；　ｉ　＜　

ＸＭＬ字符串的获取器。　

ｒｅｓｐｏｎｓｅＸＭＬ：ＸｍｌＤｏｃｕｍｅｎｔ）　

ｐｒｅｆｉｘｅｓ．１ｅｎｇｔｈ；ｉ＋＋）｛　

Ｄｏｃｕｍｅｎｔ．ｐｒｏｔｏｔｙｐｅ．　

３．２发送ＸＭＬ文档　

ｔｒｙ｛　

ｄｅｆｉｎｅＧｅｔｔｅｒ

（”ｘｍｌ”，ｆｕｎｃｔｉｏｎ（）｛　

这里依然使用ＸｍｌＨｔｔｐ对象发送　

／／试着创建对象　

ｒｅｔｕｒｎ（ｎｅｗ　ＸＭＬＳｅｒｉａｌｉｚｅｒ（））　

ＸＭＬ文档到服务器，只需要将　

０一ｎｅｗ　ＡｃｔｉｖｅＸＯｂｊｅｃｔ　

．

ｓｅｒｉａ１ｉｚｅＴｏＳｔｒｉｎｇ（ｔｈｉｓ）；））；　

ＸｍｌＤｏｃｕｍｅｎｔ作为参数传递给ｓｅｎｄ方法　

（ｐｒｅｆｉｘｅｓ［ｉ］＋　．ＸｍｌＨｔｔｐ　；　

３使用ＸＭＬ接口　

即可。　

０２一ｎｅｗ　ＡｃｔｉｖｅＸＯｂｊｅｃｔ　

这里介绍使用在上面定义的ＸＭＬ　

ｆｕｎｃｔｉｏｎ　ｐｏｓｔＡｓｙｎｃ（ｓＵｒｉ，ｘｍｌＤｏｃ）｛　

（ｐｒｅｆｉｘｅｓ　Ｅｌｉ＋”．ＸｍｌＤｏｍ　）；　

接口的方法、　

ｖａｒ　ｘｍｌＨｔｔｐ—ＸｍｌＨｔｔｐ．ｃｒｅａｔｅ　

ｒｅｔｕｒｎ　

３．１请求ＸＭＬ文档　

（）；　

ｇｅｔｃｏｎｔｒｏ１Ｐｒｅｆｉｘ．ｐｒｅｆｉｘ—ｐｒｅｆｉｘｅｓ　Ｅ１］；　

使用异步ＸｍｌＨｔｔｐ　

ｘｍｌＨｔｔｐ．ｏｐｅｎ（”ＧＥＴ”，ｓＵｒｉ，　

）　

从服务器请求ＸＭＬ文档既可以使　

ｔｒｕｅ）；　

ｃａｔｃｈ（ｅｘ）｛）；）　

用ＸｍｌＨｔｔｐｔ对象也可以使用　

ｘｍｌＨｔｔｐ．ｏｎｒｅａｄｙｓｔａｔｅｃｈａｎｇｅ　＝　

ｔｈｒｏｗ　ｎｅｗ　Ｅｒｒｏｒ（”找不到已安装的　

ＸｍｌＤｏｃｕｍｅｎｔ对象。一般使用第１个对　

ｆｕｎｃｔｉｏｎ（）｛　

ＸＭＬ解析器”）；）　

象，因为它的功能更强大一些。　

ｉｆ（ｘｍｌＨｔｔｐ．ｒｅａｄｙＳｔａｔｅ＝一４）　

２．４扩展Ｍｏｚｉｌｌａ对ＸＭＬ的支持　

ｆｕｎｃｔｉｏｎ　ｌｏａｄＡｓｙｎｃ（ｓＵｒｉ）｛　

ｄｏＳｏｍｅｔｈｉｎｇ　

希望在对象ＸｍｌＤｏｃｕｍｅｎｔ上使用名　

ｖａｒ　ｘｍｌＨｔｔｐ＝ＸｍｌＨｔｔｐ．ｃｒｅａｔｅ　

（ｘｍｌＨｔｔｐ．ｒｅｓｐｏｎｓｅＸＭＬ　）；　／／　

为ｌｏａｄＸＭＬ的方法，该方法以一个字符　

（）；　

ｒｅｓｐｏｎｓｅＸＭＬ：ＸｍｌＤｏｃｕｍｅｎｔ）　

串为参数并将它解析成ＸＭＬ。Ｍｏｚｉｌｌａ版　

ｘｍｌＨｔｔｐ．ｏｐｅｎ（　ＧＥＴ　，ｓＵｒｉ，　

ｘｍｌＨｔｔｐ．ｓｅｎｄ（ｘｍｌＤｏｃ）；）　

本的ＸｍｌＤｏｃｕｍｅｎｔ本身不支持这个方　

ｔｒｕｅ）；　

４结束语　

法，于是需要扩展Ｄｏｃｕｍｅｎｔ的　

ｘｍｌＨｔｔｐ．ｏｎｒｅａｄｙｓｔａｔｅｃｈａｎｇｅ＝＝　

在浏览器中操纵ＸＭＬ文档以及从　

ｐｒｏｔｏｔｙｐｅ。在Ｍｏｚｉｌｌａ中解析ＸＭＬ字符　

ｆｕｎｃｔｉｏｎ（）ｆ　

（向）服务器读取（发送）ＸＭＬ文档是　

串可以使用内置在ＤＯＭＰａｒｓｅｒ对象中的　

ｉｆ（ｘｍｌＨｔｔｐ．ｒｅａｄｙＳｔａｔｅ一一４）　

ＡＪＡｘ技术的核心部分，但目前还未成为　

方法。　

ｄｏＳｏｍｅｔｈｉｎｇ　

Ｗ３Ｃ的标准。ＩＥ和Ｍｏｚｉｌｌａ是目前用得最　

要从ＸＭＬ字符串装入文档，首先要　

（ｘｍｌＨｔｔｐ．ｒｅｓｐｏｎｓｅＸＭＬ　）；　／／　

多的两种浏览器，前者通过ＡｃｔｉｖｅＸ控件　

解析该字符串，然后删除原始树中的所有　

ｒｅｓｐｏｎｓｅＸＭＬ：ＸｍｌＤｏｃｕｍｅｎｔ　

支持ＸＭＬ且功能强大，后者对ＸＭＬ的　

结点并插入从已解析的字符串得到的文　

）　

支持是原生的但功能不够完善。为了方便　

档中的所有结点。　

ｘｍｌＨｔｔｐ．ｓｅｎｄ（ｎｕｌ１）；）　

开发ｗｅｂ应用，本文对ＩＥ和Ｍｏｚｉｌｌａ中　

Ｄｏｃｕｍｅｎｔ．ｐｒｏｔｏｔｙｐｅ．１ｏａｄＸＭＬ　—　

ｏｐｅｎ方法带３个参数，第１个参数取　

的ＸＭＬ对象进行了封装，实现了一个跨　

ｆｕｎｃｔｉｏｎ（ｓ）（　

值为“ＧＥＴ”或“ＰＯＳＴ”。最后一个参数决　浏览器的ＸＭＬ接口。