- 浏览: 196608 次
- 性别:
- 来自: 杭州
文章分类
最新评论
-
nenyalanye_1:
没用过 下下来研究研究!
JSDT-Eclipse下的Javascript调试插件 -
noahweb:
datas = new BO.Datas();
entryA ...
Easyb初体验 -
noahweb:
easyb 如何定义一个list?结构如下,如果对BO.Dat ...
Easyb初体验 -
elemark:
很有用,受教了其中关于响应时间timeout的处理,帮了我的大 ...
Ext点滴 -
inritxihc:
哦哦,解决了我的疑惑。
div层遮盖flash(兼容浏览器)
转自:http://www.duduwolf.com/wiki/2007/310.html
javacript中对xml dom的支持,与其他任何特性一样面临着浏览器兼容问题。
一 IE中的XML DOM
1.微软通过ActiveX的MSXML库提供了支持,通过:
得到一个XML DOM对象,这是在IE6中的,如果你的IE是更老版本的,可以使用下面的函数得到,如果你没有安装MSXML,将不能得到:
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 " );
}
当然,如果你使用prototype库,可以使用Try.these函数。
2.XML DOM对象可以通过load和loadXML方法载入xml文件或者字符串:
oXmlDom.loadXML( " <root></root> " );
然后这个oXmlDom就可以使用所有的DOM对象方法,比如documentElement.tagName,参见:
《javascript之DOM技术(一)》
《javascript之dom技术(二)》
3.XML DOM默认是通过异步载入xml文件的,可以通过设置async值来选择是同步还是异步:
4. IE的XML DOM拥有一个readyState值用来表示载入文件的状态:
0——准备载入
1——正在载入
2——载入完成
3——载入完成并可用,但有一部分数据也许不可用
4——完全载入,完全可用。
相应的有一个onreadystatechange事件,当状态改变时发生,我们可以通过监听此事件来判断XML DOM对象的可用性
if (oXmlDom.readyState == 4 ) {
alert( " load test.xml done! " );
alert( " Tag name of the root element is " + oXmlDom.documentElement.tagName);
alert( " The root element has this many children: " + oXmlDom.documentElement.childNodes.length);
}
};
5.IE的XML DOM对象有一个xml属性,用来返回xml文件的字符串形式,比如
oXmlDom.load( " test.xml " );
alert(oXmlDom.xml);
alert出:<root><child/><child/></root>
6.IE,当载入的XML文件或者字符串解析错误时,将产生一个parseError对象,我们在下面的代码中演示此对象的属性:
oXmlDom.load( " errors.xml " );
// 0表示没有错误
if (oXmlDom.parseError != 0 ) {
var oError = oXmlDom.parseError;
alert( " An error occurred:\n错误代码: "
+ oError.errorCode + " \n "
+ " 行数: " + oError.line + " \n "
+ " 列数: " + oError.linepos + " \n "
+ " 原因: " + oError.reason);
}
二.Mozilla的XML DOM对象
1.XML DOM对象的创建,符合DOM标准的,通过document.implementation.createDocument()方法。比如:
这三个参数分别是文档命名空间、文档元素的标签名以及一个文档类型对象(总为null),比如:
这段代码创建了一个<a0:root xmlns="http://www.rubyeye.net"/>的XML DOM对象
2.载入xml,Mozilla与IE不同的是只提供了一个load()方法用于载入xml文件,没有提供loadXML()方法用于载入XML字符串。同步载入XML文件的代码与IE相同:
oXmlDom.load( " test.xml " );
异步载入稍有不同,因为Mozilla并不支持readyState属性,并且没有onreadystatechange事件,它只有一个onload的事件,当载入完成时触发;或者说相当于IE的readyState属性等于4的状态。
alert( " done " );
}
oXmlDom.load( " test.xml " );
要将XML字符串解析为DOM对象,必须使用DOMParser对象:
var oXmlDom=oParser.parseFromString( " <root><child/></root>, " text / xml " );
两个参数:要解析的XML字符串以及字符串的内容类型(只能为text/xml或者application/xml)。
不过我们可以实现自己的loadXML方法:
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);
}
};
3.Mozilla没有提供IE的xml属性来返回XML文档内容,只能通过使用XMLSerializer对象:
var sXml = oSerializer.serializeToString(oXmlDom, " text/xml " );
同样两个参数:XML DOM对象以及转化成的文档类型。
同样,我们也可以给Mozilla的XML DOM对象定义一个属性xml,通过defineGetter方法:
var oSerializer = new XMLSerializer();
var sXml = oSerializer.serializeToString( this , " text/xml " );
});
以后就可以以IE的方式,oXmlDom.xml来获取XML文档内容。
4。错误处理,同样与IE不同,Mozilla当解析错误时会返回一段代码,以标签<prasereoor>包括其中的代码解释了错误发生的原因以及位置等信息,我们只有通过正则表达式解析此段代码,提取错误信息。
// 返回代码的标签名为parsererror,表示错误发生
if (oXmlDom.documentElement.tagName == " parsererror " ) {
reError.test(oXmlDom.xml);
alert( " An error occurred:\n描述: "
+ RegExp.$ 1 + " \n "
+ " 文件名: " + RegExp.$ 2 + " \n "
+ " 行数: " + RegExp.$ 3 + " \n "
+ " 列数: " + RegExp.$ 4 + " \n "
+ " 原因: " + RegExp.$ 5 );
}
三,提供一个跨浏览器的XML DOM对象解决方案,来自于《javascript高级程序设计》
function XmlDom() {
// 通过对象/属性检测法,判断是IE来是Mozilla
if (window.ActiveXObject) {
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 );
// 创建Mozilla版本的parseError对象
oXmlDom.parseError = {
valueOf: function () { return this .errorCode; },
toString: function () { return this .errorCode.toString() }
};
// 初始化parseError对象
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. " );
}
}
// 此处用到了该书中一个浏览器系统检测js文件,如果是Mozilla
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();
}
};
// 初始化parseError对象
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 ;
}
};
// 定义Mozilla的loadXML方法
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__();
// 没有问题,设置readyState属性为4
this .__changeReadyState__( 4 );
};
Document.prototype.__load__ = Document.prototype.load;
Document.prototype.load = function (sURL) {
this .__initError__();
this .__changeReadyState__( 1 );
this .__load__(sURL);
};
Node.prototype.__defineGetter__( " xml " , function () {
var oSerializer = new XMLSerializer();
return oSerializer.serializeToString( this , " text/xml " );
});
}
发表评论
-
虚拟机Ubuntu上WAS的安装笔记
2009-11-16 15:46 1793最近大家都在玩虚拟机,也决定装一个玩玩,要不然还真 ... -
如何进行Ajax框架选型?
2009-07-30 09:16 1130Ajax/RIA框架异彩纷呈,该如何做出取舍呢,《 Ajax ... -
设计中最常用的五类CSS选择器
2009-03-09 09:59 1103一、标签选择器: 顾名思议,标签选择器是直接将HT ... -
Ext点滴
2009-02-19 17:27 3632Ext.fly()正解 写道 Result: ... -
Ext事件机制
2009-02-19 14:41 1285先看看这里的说明:http://www.cnblogs.com ... -
Ext中实现表单列的横排
2009-01-22 16:50 2424首先看一个界面: 默认情况下,Ext中的FormPan ... -
全面理解javascript的caller,callee,call,apply概念
2009-01-08 14:15 1103转自:http://javascript.chinahtml ... -
JSDT-Eclipse下的Javascript调试插件
2008-11-11 08:24 4607简介: JSDT(Javascript De ... -
JS事件处理的一点细节
2008-10-16 09:20 1018在Javascript中我们可以利用下面的方式来给一个HTM ... -
Web开发小技巧
2008-08-17 13:41 906只显示垂直滚动条,不显示水平滚动条:设置body的style ... -
Cookie操作
2008-08-17 13:30 11081、在Javascript中操作Cookie: < sc ... -
JSON使用
2008-08-08 14:09 3499是什么? JSON(JavaScript O ... -
同源策略
2008-08-08 12:00 3576概念: 同源策 ... -
HTTP原始方法上传下载文件
2008-08-08 11:58 1311上传: 1、设置表单的ENCTYPE='multipart/f ... -
div VS. span
2008-08-08 11:54 1036在CSS的布局概念中,SPAN是一个内联元素(in ... -
利用JS屏蔽右键和检测键盘按键
2008-08-05 21:33 3188屏蔽鼠标右键: <body oncontextmenu= ...
相关推荐
Javascript操作XML Dom学习资料
javascript 操作xml_dom对象整理集合:里面还有很多js技巧集合,要的就下啊
javascript中,不论是解析xml文件,还是xml格式的字符串,都是通过DOM对象来进行操作的。希望本文档会给有需要的朋友带来帮助;感兴趣的朋友可以过来看看 资源截图: 资源太大,传百度网盘了,链接...
JavaScript DHTML XMLDOM CSS 中文版参考大全
说明:为了方便下载本人已压缩 参考手册 ...XHTML 1.0 CSS 2.0 ...JavaScript 对象实例 DHTML 实例 VBScript 实例 ASP 实例 ADO 实例 SVG 实例 XSLT 1.0 XPath 2.0 XSL-FO WML 1.1 HTML 颜色
树型结构(javascript+dom+xml+css) 它是现在比较流行的一种技术,我花了一个星期的时间才做出来,和你们以前所做的树有是不一样的啊
MSXML与JavaScript语言技术进行XML编程 ,讲述JavaScript生成DOM文档对象的方法
DOM是针对XML的基于树的API,它关注的不仅仅是解析XML代码,而是用一系列相互关联的对象来表示这些代码,而这些对象可以被修改,而且无需重新解析代码就能直接访问它们。由于DOM的使用上的简便,因此它成为了Web...
Javascript里使用Dom操作Xml.docx
1) JavaScript函数的定义以及JavaScript的调试; 2) 使用DOM操作寻找XHTML节点; 3) 使用DOM操作修改内容的样式; 4) 使用DOM操作创建节点。
Javascript里使用Dom操作Xml_1.docx
var xmlDoc = new ActiveXObject("Microsoft.XMLDOM") 'JAVASCRIPT中的创建对象 set objXml=CreateObject("Microsoft.XMLDOM") '创建解析器对象 objXml.async="false" objXml.load("test.xml") '装载xml文件 ...
从颇具深度的JavaScript语言基础到作用域(链),从引用类型到面向对象编程,从极其灵活的匿名函数到闭包的内部机制,从浏览器对象模型(BOM)、文档对象模型(DOM)到基于事件的Web脚本设计,从XML(E4X)到Ajax及JSON,从...
javascript dom操作,跨浏览器操作dom dom实例,dom参考
As well as focusing on client-side JavaScript, you will also learn how to work with the Browser Object Model, the Document Object Model (DOM), how to use XML and JSON as well as communicate with ...
XML&DOM节点属性、方法参考,是搞AJAX DOM操作必备文档。
JAVA、PHP、JS(JAVASCRIPT DOM)、HTML、XML、CSS、W3C、正则表达式、WEB开发人员必备CHM工具手册大全打包下载.rar 这里是我个人在WEB开发7年来,收集的CHM工具手册中精选出来的,每个都是精品中的精品,个人认为...
XML DOM手册,CHM格式,AJAX开发必备!
As well as focusing on client-side JavaScript, you will also learn how to work with the Browser Object Model, the Document Object Model (DOM), how to use XML and JSON as well as communicate with ...
2.5.1 为什么需要JavaScript日志对象 2.5.2 myLogger()对象 2.6 小结 第3章 DOM2核心和DOM2 HTML 3.1 DOM不是JavaScript,它是文档 3.2 DOM的级别 3.2.1 DOM 0 级 3.2.2 ...