在Mozilla/Firefox中使用JavaScript和 XSLT
作者：onestab
简介
由于现代的浏览器都支持 XSLT，开发者现在可以借助于 JavsScript 利用 XSLT 的强大功能。Web 应用程序可使用JavaScript 载入XML数据、通过 XSLT 将其转换成指定的显示格式，并添加到当前的页面。由于 XML 文档只包含数据信息，而不管如何显示，所以可以非常快速地载入。
从 Mozilla 1.2 开始， Gecko 支持从 JavsScript 创建 XSLT 处理器，本文讨论了如何在基于Gecko引擎的浏览器中使用 JavsScript 进行 XSLT 转换。
Gecko 中的 JavaScript 与 XSLT
JavaScript 可以通过 XSLTProcessor 对象实现 XSLT 转换，XSLTProcessor 对象有一个 importStylesheet 方法，该方法的参数是一个转换用的 XSLT 样式表，该样式表其实也是一个 XML 文件，也就是说，在调用 importStylesheet 之前必须先装入该 .xsl 文件。我们可以通过 XMLHttpRequest 或 XMLDocument.load 方法将其载入。
图一：初始化 XSLTProcessor 对象
var xlstProcessor = new XSLTProcessor();
// 使用同步的方式装入 xsl 文件
var myRequest = new XMLHttpRequest();
myRequest.open("GET", "example.xsl", false);
myRequest.send(null);
var xslRef = myRequest.responseXML;
// 现在可以引入 xsl了
xsltProcessor.importStylesheet(xslRef);
被转换的 XML 文档可通过另一个 XMLDocument 对象载入，也可以是HTML DOM 的一个片断。要处理 HTML DOM 的片断，这里假定它包含在 id 为 example 的元素中，首先要在内存中创建一个 XMLDocument，再使用 XMLDocument 的 importNode 方法，这个方法允许我们在文档之间传递 DOM 片断（此处为从 HTMLDocument 到 XMLDocument）。importNode 方法的第一个参数是被克隆的 DOM 结点，第二个参数表示克隆的"深度"，如果设置为 true，则克隆该结点的所有子孙结点，即"深度克隆"。克隆出来的 DOM 结点可以很容易地使用 appendChild 方法插入到 XMLDocument 中。
图二：从 HTML 片断创建 XML 文档
// 创建 XML 文档对象
var xmlRef = document.implementation.createDocument("", "", null);
// 使用 importNode 将HTML DOM 的一部分转换为XML 文档。
// 参数 true 表示克隆全部子元素。
var myNode = document.getElementById("example");
var clonedNode = xmlRef.importNode(myNode, true);
// 将克隆的结点添加到 XML 对象
xmlRef.appendChild(clonedNode);
引入了样式表之后，就该进行真正的转换了。XSLTProcessor 有两种方法可供使用，分别是 transformToDocument() 和 transformToFragment()。transformToDocument() 返回一个完整的 XMLDocument, 而 transformToFragment() 则返回一个DOM片断，可以很容易地插入到当前页面。二者都有求将 DOM Node 对象作为参数，而 transformToFragment()还要求传入类型为Document的第二个参数，该对象将用来容纳所产生的 DOM 片断，如果该片断将要插入到当前页面中，可直接传入 document。
图三：实施转换
var fragment = xsltProcessor.transformToFragment(xmlRef, document);
例1 - 基本的 XSLT 转换
本例子演示了在基于Gecko引擎的浏览器(Mozilla/Firefox/Netscape)中使用 XMLHttpRequest 装入 XML 和 XSL 文档，并使用 XSLTProcessor 进行转换。
查看实例 对不起，您正在使用的浏览器将无法运行示例。
设置 XSLT 的参数
使用现成的 .xsl 和 .xml 文件进行转换当然不错，但如果使用 JavaScript 对其进行配置更为有用。例如，我们可使用 JavaScript 和 XSLT 对 XML 数据进行排序并显示结果，排序方式可以是升序或降序。
XSLT 提供了 xsl:param 元素，可为XSLT设置参数，它是 xsl:stylesheet 的子元素。XSLTProcessor 为访问参数提供了三种方法： setParameter, getParameter 和 removeParameter。其第一个参数为 xsl:param 的名称空间的 URI（通常我们用的都是默认的名称空间，所以可直接传入 "null" ）。第二个参数是 xsl:param 的本地名称，当然，setParameter 的第三个参数是要设置的参数的值。
图四：传递参数
XSLT 片断：
<xsl:param name="myOrder" />
JavaScript:
var sortVal = xsltProcessor.getParameter(null, "myOrder");
if (sortVal == "" || sortVal == "descending")
xsltProcessor.setParameter(null, "myOrder", "ascending");
else
xsltProcessor.setParameter(null, "myOrder", "descending");
例2 - 设置XSLT参数
本例演示了在基于Gecko引擎的浏览器(Mozilla/Firefox/Netscape)中将HTML DOM 片断转换为 XML 片断，使用 XMLHttpRequest 装入 XSL 文档，获取并设置 XSLT 的参数，用 XSLTProcessor 实施转换，再将转换后的结果动态添加到 HTML 文档中。
查看例子 对不起，您正在使用的浏览器将无法运行示例。
XSLTProcessor 接口列表
XSLTProcessor 方法
- void importStylesheet(DOMNode styleSheet)
- 引入 XSLT 样式表
styleSheet 为 XSLT stylesheet 的根结点。 - DOMDocumentFragment transformToFragment(DOMNode source, DOMDocument owner)
- 使用由importStylesheet()引入的样式表对结点
source进行转换，owner 结点是容纳转换结果的 DOMDocument. - DOMDocument transformToDocument(DOMNode source)
- 使用由importStylesheet()引入的样式表对结点
source进行转换. - void setParameter(String namespaceURI, String localName, Variant value)
- 设置 XSLT stylesheet 的参数。
- Variant getParameter(String namespaceURI, String localName)
- 取得 XSLT stylesheet 的参数的值。
- void removeParameter(String namespaceURI, String localName)
- 去除 XSLT stylesheet 指定参数的值，这将导致 XSLT 使用默认的参数值。
- void clearParameters()
- 去除 XSLT stylesheet 中所有参数的值，这将导致 XSLT 使用默认的参数值。
- void reset()
- 从 XSLTProcessor 中去除所有样式表和参数。
浏览器差异
Netscape 7.x, Mozilla 1.2x 和 Firefox 0.9x 以及 Internet Explorer 6 (Windows) 支持 W3C XSLT 1.0 标准 (http://www.w3.org/TR/xslt). IE 5.0 和 5.5 仅只持 XSLT 草案, 与 XSLT 1.0 stylesheets 不兼容。
相关资源