JavaScript高级程序设计 阅读笔记(二十一) JavaScript中的XML

一、IE中的XML DOM支持

  IE对XML的支持是基于ActiveX的MSXML库。

  1、DOM创建

  对每个新版本的MSXML,都会创建出不同的XML DOM对象,所以尽量选择新的XML DOM版本。

  2、载入XML

  载入XML分两种,即:

  载入XML字符串:loadXML(xml字符串)

  载入xml文件:load(xml文件路径)。默认情况下文件载入是异步的,如果要改为同步把asynce特性改为true即可。异步载入文件时要用到readyState和onreadystatechange事件处理函数。readyState共有五种可能的值:

    0——DOM尚未初始化任何信息;

    1——DOM正在载入数据;

    2——DOM完成了数据载入;

    3——DOM已经可用,不过某些部分可能还不能用;

    4——DOM已经完全被载入,可以使用了。

  3、获取XML

  微软为每个节点增加了xml特性,所以获取XML非常方便,见后面的示例。

  4、解释错误

  可以用parseError来处理XML载入过程中出现的错误。

  parseError特性实际上是包含以下特性的对象:

  errorCode:错误类型数字代码,没有错误为0

  filePos:错误发生在文件中的位置

  line:遇到错误的行号

  linepos:在遇到错误的那一行上的字符的位置

  reason:对错误的一个解释

  srcText:造成错误的代码

  url:造成错误的文件的URL

  5、示例:

  

复制代码 代码如下:

  function createXMLDOM(){

  var arrSignatures=["MSXML2.DOMDocument.5.0","MSXML2.DOMDocument.4.0","MSXML2.DOMDocument.3.0","MSXML2.DOMDocument","Microsoft.XmlDom"];

  for(var i=0;i<arrSignatures.length;i++){

  try{

  var oXmlDom=new ActiveXObject(arrSignatures[i]);

  return oXmlDom;

  } catch(oError){

  }

  }

  throw new Error("MSXML is not installed on your system");

  }

  var oXmlDom=createXMLDOM();

  //方式一:加载字符串

  oXmlDom.loadXML("<root><child/></rot>");

  //处理错误

  if(oXmlDom.parseError != 0){

  var oError=oXmlDom.parseError;

  alert("An Error occurred:\nError Code:" + oError.errorCode

  + "\nLine:" + oError.line + "\nLine Pos:" + oError.linepos

  + "\nReason:" + oError.reason);

  } else {

  var childNodes=oXmlDom.documentElement.childNodes;

  console.log(childNodes.length+" "+childNodes[0].xml);// 1 <child/>

  }

  //方式二:加载XML文件

  oXmlDom.onreadystatechange = function(){

  //文档加载完毕

  if(oXmlDom.readyState == 4){

  if(oXmlDom.parseError != 0){

  var oError=oXmlDom.parseError;

  alert("An Error occurred:\nError Code:" + oError.errorCode

  + "\nLine:" + oError.line + "\nLine Pos:" + oError.linepos

  + "\nReason:" + oError.reason);

  } else {

  var childNodes=oXmlDom.documentElement.childNodes;

  console.log(childNodes.length+" "+childNodes[0].xml);// 1 <child/>

  }

  }

  }

  oXmlDom.load("test.xml");

  二、Mozilla中的XML DOM支持

  1、创建DOM

  DOM标准指出,document.implementation有个 createDocument() 方法:

  var oXmlDom=document.implementation.createDocument("","",null);  其中,第一个参数为文档的命名空间URL,文档元素的标签名,和文档类型对象(总是为null,因为在Mozilla中还没有支持)。

  2、载入XML

  Mozilla只支持一个载入XML的方法:load(文件名)。

  同步或异步由async决定,默认为异步。

  如果是XML字符串,要用DOMParser对象来转换成DOM,用法如下:

  

复制代码 代码如下:

  var oParser = new DOMParser();

  var oXmlDom = oParser.parseFromString("<root/>","text/xml");

   parseFromString方法第一个参数为XML字符串,第二个参数为内容类型。可以是 "text/xml" 或 "application/xml"。

  3、获取XML

  微软提供的xml特性因为不是标准,所以Mozilla不支持,Mozilla提供了XMLSerializer对象:

  

复制代码 代码如下:

  var oSerializer = new XMLSerializer();

  var sXml = oSerializer.serializeToString(oXmlDom,"text/xml");  在后面的例子中我们可以看到如何用defineGetter()方法来定义一个xml特性。

  4、解析错误

  在XML文件的解析过程中发生错误时,XML DOM会创建文档来解释这个错误。常常用正则来输出错误信息:

  

复制代码 代码如下:

  var reError = />([\s\S]*?)Location:([\s\S]*?)Line Number (\d+),Column (\d+):<sourcetext>([\s\S]*?)(?:\-*\^)/;

  if(oXmlDom.documentElement.tagName == "parsererror"){

  reError.test(oXmlDom.xml);

  alert("An error occurred:\nDescription: " + RegExp.$1 +"\n"

  + "File: " + RegExp.$2 + "\n"

  + "Line: " + RegExp.$3 + "\n"

  + "Line Pos: " + RegExp.$4 + "\n"

  + "Source: " + RegExp.$5);

  }

  5、示例

  

复制代码 代码如下:

  var oXmlDom=document.implementation.createDocument("","<root>",null);

  oXmlDom.async = false;

  oXmlDom.onload = function(){

  alert('Done');

  }

  var reError = />([\s\S]*?)Location:([\s\S]*?)Line Number (\d+),Column (\d+):<sourcetext>([\s\S]*?)(?:\-*\^)/;

  if(oXmlDom.documentElement.tagName == "parsererror"){

  reError.test(oXmlDom.xml);

  alert("An error occurred:\nDescription: " + RegExp.$1 +"\n"

  + "File: " + RegExp.$2 + "\n"

  + "Line: " + RegExp.$3 + "\n"

  + "Line Pos: " + RegExp.$4 + "\n"

  + "Source: " + RegExp.$5);

  }

  Node.prototype.__defineGetter__("xml", function () {

  var oSerializer = new XMLSerializer();

  return oSerializer.serializeToString(this, "text/xml");

  });

  oXmlDom.load('test.xml');

  alert(oXmldom.xml);

  var oNode = oXmlDom.documentElement.childNodes[1];

  alert(oNode.xml);

  三、通用接口

  下面是兼容IE和FireFox的通用接口:

  

复制代码 代码如下:

  function XmlDom() {

  if (window.ActiveXObject) {//IE

  var arrSignatures = ["MSXML2.DOMDocument.5.0", "MSXML2.DOMDocument.4.0",

  "MSXML2.DOMDocument.3.0", "MSXML2.DOMDocument", "Microsoft.XmlDom"];

  for (var i = 0; i < arrSignatures.length; i++) {

  try {

  var oXmlDom = new ActiveXObject(arrSignatures[i]);

  return oXmlDom;

  }

  catch (oError) {

  //ignore

  }

  }

  throw new Error("MSXML is not installed on your system.");

  } else if (document.implementation && document.implementation.createDocument) {

  var oXmlDom = document.implementation.createDocument("", "", null);

  oXmlDom.parseError = {valueOf:function () {

  return this.errorCode;

  }, toString:function () {

  return this.errorCode.toString();

  }};

  oXmlDom.__initError__();

  oXmlDom.addEventListener("load", function () {

  this.__checkForErrors__();

  this.__changeReadyState__(4);

  }, false);

  return oXmlDom;

  } else {

  throw new Error("Your browser doesn't support an XML DOM object.");

  }

  }

  if (isMoz) {

  Document.prototype._readyState_ = 0;

  Document.prototype.onreadystatechange = null;

  Document.prototype.__changeReadyState__ = function (iReadyState) {

  this._readyState_ = iReadyState;

  if (typeof this.onreadystatechange == "function") {

  this.onreadystatechange();

  }

  };

  Document.prototype.__initError__ = function () {

  this.parseError.errorCode = 0;

  this.parseError.filepos = -1;

  this.parseError.line = -1;

  this.parseError.linepos = -1;

  this.parseError.reason = null;

  this.parseError.srcText = null;

  this.parseError.url = null;

  };

  Document.prototype.__checkForErrors__ = function () {

  if (this.documentElement.tagName == "parsererror") {

  var reError = />([\s\S]*?)Location:([\s\S]*?)Line Number (\d+),Column (\d+):<sourcetext>([\s\S]*?)(?:\-*\^)/;

  reError.test(this.xml);

  this.parseError.errorCode = -999999;

  this.parseError.reason = RegExp.$1;

  this.parseError.url = RegExp.$2;

  this.parseError.line = parseInt(RegExp.$3);

  this.parseError.linepos = parseInt(RegExp.$4);

  this.parseError.srcText = RegExp.$5;

  }

  };

  Document.prototype.loadXML = function (sXml) {

  this.__initError__();

  this.__changeReadyState__(1);

  var oParser = new DOMParser();

  var oXmlDom = oParser.parseFromString(sXml, "text/xml");

  while (this.firstChild) {

  this.removeChild(this.firstChild);

  }

  for (var i = 0; i < oXmlDom.childNodes.length; i++) {

  var oNewNode = this.importNode(oXmlDom.childNodes[i], true);

  this.appendChild(oNewNode);

  }

  this.__checkForErrors__();

  this.__changeReadyState__(4);

  };

  Document.prototype.__load__ = Document.prototype.load;

  Document.prototype.load = function (sURL) {

  this.__initError__();

  this.__changeReadyState__(1);

  this.__load__(sURL);

  };

  Document.prototype.getReadyState = function () {

  return this._readyState_;

  };

  Node.prototype.__defineGetter__("xml", function () {

  var oSerializer = new XMLSerializer();

  return oSerializer.serializeToString(this, "text/xml");

  });

  }

  四、其他浏览器

  本书中没有讲到其他浏览器,如现在很火的Chrome,最新版的主流浏览器现在都已支持上面讲到的Mozilla方式。如果不支持,可以用AJAX来读取处理XML。

  作者:Artwl

  出处:http://artwl.cnblogs.com