• 售前

  • 售后

热门帖子
入门百科

一个用xslt样式将xml剖析为xhtml的类TransformBinder(兼容FF和IE7.0)

[复制链接]
462710480 显示全部楼层 发表于 2021-8-19 19:44:11 |阅读模式 打印 上一主题 下一主题
由于前面的方法xslt必要在xml文件内部直接导入,而项目中用到的xml文件是体系天生的,只能提供路径,而没有办法改写xml内里的内容,以是必要找一个方法能够在外部将xml和xslt关联在一起,如许既到达了目标,也可以应用于多个xml文件,方便管理。
先上代码,体系中使用module这个js进行打包,module这个工具是专门用来将js进行打包,这个工具以后的文章再做先容,我自己如今只会使用,还没研究其底层的代码;这边我们将js写在一个文件内里,包罗类以及类实现的方法,
下面是js代码:transform.js
复制代码 代码如下:
var XmlDom=function(){
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);
return oXmlDom;
} catch (oError) {
//ignore
}
}
throw new Error("你的体系没有安装 MSXML.");
} else if(document.implementation.createDocument){ // Firefox
var oXmlDom = document.implementation.createDocument("", "", null);
return oXmlDom;
} else{
throw new Error("欣赏器不支持 XML DOM object.");
}
}
var transformXSLT=function(_XML,_XSL) {
if (window.Node) {
Node.prototype.transformNode = function(XslDom) {
var oProcessor = new XSLTProcessor();
oProcessor.importStylesheet(XslDom);
var oResultDom = oProcessor.transformToDocument(myXmlDom);
var oSerializer = new XMLSerializer();
var sXml = oSerializer.serializeToString(oResultDom, "text/xml");
return sXml;
}
}
var myXmlDom = new XmlDom();
myXmlDom.async=false;
var myXslDom = new XmlDom();
myXslDom.async=false;
myXmlDom.load(_XML);
myXslDom.load(_XSL);
var sResult=myXmlDom.transformNode(myXslDom);
if(window.ActiveXObject){
if(myXmlDom.parseError.errorCode != 0){
var sError=myXmlDom.parseError;
var txt = "";
txt += "<br>错误代码: ";
txt += sError.errorCode;
txt += "<br>错误缘故原由: ";
txt += sError.reason;
txt += "<br>错误行号: ";
txt += sError.line;
document.write(txt);
}else{
document.write(sResult);
}
} else if(document.implementation.createDocument){
var oSerializer = new XMLSerializer();
var sXmlDom = oSerializer.serializeToString(myXmlDom, "text/xml");
var oParser = new DOMParser();
var oXmlDom = oParser.parseFromString(sXmlDom,"text/xml");
if (oXmlDom.documentElement.tagName == "parsererror") {
var oXmlSerializer = new XMLSerializer();
var sXmlError = oXmlSerializer.serializeToString(oXmlDom);
alert(sXmlError);
} else {
document.write(sResult);
}
}
}
var TransformBinder = function(XML,XSL) {
this.XML = XML;
this.XSL = XSL;
}
TransformBinder.prototype.registerAction = function(handlers) {
this.handlers = handlers;
}
TransformBinder.prototype.bind = function() {
var _this = this;
this.handlers(_this.XML,_this.XSL);
}

下面是html代码:XSLTtransform.htm
复制代码 代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type='text/javascript' src="transform.js"></script>
</head>
<body>
<script type="text/javascript">
var XML = "这里输入XML路径";
var XSL = "这里输入XSL路径";
var tempObj = new TransformBinder(XML,XSL);
tempObj.registerAction(transformXSLT);
tempObj.bind();
</script>
</body>
</html>

分析一下transform.js:
xmlDom这个构造函数是用来创建xml的dom元素,对于IE和FF,创建dom的方法不一样,IE是用window.ActiveXObject这个方法来创建,而FF用document.implementation.createDocument这个方法来创建,我们用这两个属性来判定是IE还是FF。
IE下针对不同版本的xml["MSXML2.DOMDocument.5.0", "MSXML2.DOMDocument.4.0", "MSXML2.DOMDocument.3.0", "MSXML2.DOMDocument","Microsoft.XmlDom"],用for循环进行遍历查找到对应的版本再new ActiveXObject(arrSignatures)创建dom;
FF下用document.implementation.createDocument("", "", null);直接创建dom ;
假如欣赏器不支持 XML DOM object则throw错误 。
transformXSLT这个构造函数用XSLT将xml转换成html,FF下没有transformNode这个方法,以是我们自己构造了一个方法,
复制代码 代码如下:
Node.prototype.transformNode = function(XslDom) {
var oProcessor = new XSLTProcessor();
oProcessor.importStylesheet(XslDom);
var oResultDom = oProcessor.transformToDocument(myXmlDom);
var oSerializer = new XMLSerializer();
var sXml = oSerializer.serializeToString(oResultDom, "text/xml");
return sXml;
}

然后用这个方法实现转换,在处置处罚错误上IE和FF又有不同的处置处罚方法,IE比较简单,有一个parseError属性装载错误信息,errorCode是错误的代码,reason是错误缘故原由,line是错误的行号,还有其他一些信息,这里只要显示重要的错误信息就可以了,假如堕落了就显示堕落内容,假如没有堕落则显示转换的结果sResult。FF下就比较复杂一点,用XMLSerializer和XMLSerializer.serializeToString()将xmlDom转换为字符串,再将字符串转换成dom对象,在转换的过程中假如报错,就能得到包罗有parsererror的信息,判定得到的字符串的tagName是不是parsererror,假如是则将dom对象再转换成字符串抛出字符串中的内容,假如不是则显示转换的结果sResult。
这里有几个注意点:
a.IE能查验出XML的DTD错误,而FF下只能查验出XML本身的语法错误;
b.因为必要在欣赏器下判定错误,终极的结果欠好归并,大概代码布局上看起来不太公道,这也是无奈之举。
用TransformBinder这个类进行封装,便于扩展和修改。TransformBinder.prototype.registerAction这个原型用于注册事件,再用TransformBinder.prototype.bind将事件进行绑定,必要使用这个类的时间,只必要new TransformBinder(XML,XSL),注册transformXSLT事件,再bind进行绑定,如许就实现这个结果了。假如必要扩展,再创建新的构造函数,注册并绑定到这个类上就可以实现结果。

帖子地址: 

回复

使用道具 举报

分享
推广
火星云矿 | 预约S19Pro,享500抵1000!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

草根技术分享(草根吧)是全球知名中文IT技术交流平台,创建于2021年,包含原创博客、精品问答、职业培训、技术社区、资源下载等产品服务,提供原创、优质、完整内容的专业IT技术开发社区。
  • 官方手机版

  • 微信公众号

  • 商务合作