至顶网›软件频道 ›应用软件›[HOW TO] 如何在Mozilla Gecko 用Javascript加载XSL发表日期:2006-8-01

[HOW TO] 如何在Mozilla Gecko 用Javascript加载XSL发表日期:2006-8-01

扫一扫
分享文章到微信
扫一扫
关注官方公众号
至顶头条

Mozilla加载xslt, XSLTProcessor，XMLSerializer

作者：Leave For Back 来源：CSDN 2008年3月23日

在Mozilla Develop Center里，我们可以看到有以下的文章
首先，你需要了解如何动态载入xml文件的方法，可以用XMLDOM对象，也可以用XMLHttpRequest，的responseXML对象，这里我用的是XMLHttpRequest。

用javascript载入xslt的方法如下：
1。用XMLDOM或者用XMLHttpRequest来加载xml和xslt。
2。用XSLTProcessor.importStylesheet来引入XSLT。
3。用XSLTProcessor.transformToFragment方法来把它转换成DOM的Fragment。然后用appendChild或者用insertBefore等方法来追加或者插入这个DOM的fragment元素。
示例代码

var ownerDocument = document.implementation.createDocument("", "test", null);
var newFragment = processor.transformToFragment(domToBeTransformed, ownerDocument);

当然也可以用transformToDocument
var newDocument = processor.transformToDocument(domToBeTransformed);
需要注意的是，转换后的节点是Element或者是一个片段，所以要经过下面的序列化才可使用obj.innerHTML=new Document
4。序列化。

(new XMLSerializer()).serializeToString(newDocument)

5。在IE中，可以用XMLDOM方法，xmldoc.transformNode(xslDocument)方法来进行接的转换。

首先，我们先建立一个XML文件与XSLT文件，方便后面的讲解。
foo.xml

<?xml version="1.0" encoding="utf-8"?>

<Title>javascript load xslt in ie and mozilla</Title>

<Author>never-online</Author>

<Web>http://www.never-online.net</Web>

<Body>content is here</Body>

</Article>

foo.xsl

<?xml version="1.0" encoding="utf-8"?>

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:output method="html" />

<xsl:template match="/">

<div class="desc">Author: <xsl:value-of select="/Article/Author"/> -

Web: <xsl:value-of select="/Article/Web"/></div>

<xsl:value-of select="/Article/Body"/>

</p>

</xsl:template>

</xsl:stylesheet>

foo.html

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/tr/html4/strict.dtd">

<head>

<title> convert xsl using javascript - http://www.never-online.net </title>

.title { margin:10px 10% 0 10%; text-align:center; background-color:#639ACE; padding:10px; color:#fff; }

.desc { margin:10px 10% 0 10%; text-align:center; }

.box { margin:10px 10% 0 10%; border: 1px dotted #639ACE; padding:20px; }

</style>

//<![CDATA[

//]]>

</script>

//<![CDATA[

var xsltParser = function(xmlfileStr, xslfileStr) {

var retval = xslStylesheet = xmlDocument = null;

var browser = {

isIE:!!window.ActiveXObject,

isMozilla:(typeof document.implementation != 'undefined') && (typeof document.implementation.createDocument != 'undefined') && (typeof HTMLDocument!='undefined')