在 chrome/webkit 中使用 XSLT 转换 HTML 节点 [英] Transforming HTML nodes with XSLT in chrome/webkit

查看:29
本文介绍了在 chrome/webkit 中使用 XSLT 转换 HTML 节点的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想从带有 XSL 样式表的 XHTML 页面转换 HTML 节点.

I want to transform HTML nodes from a XHTML page with an XSL stylesheet.

这是我使用的函数:

function XSLT(xml,xsl) {
        var tmpElt = document.createElement("div");

        if (window.ActiveXObject){
            //Version IE
            tmpElt.innerHTML = xml.transformNode(xsl);
        }else{
            //Version ECMA
            var xsltProcessor = new XSLTProcessor();
            xsltProcessor.importStylesheet(xsl);
            var result = xsltProcessor.transformToFragment(xml, document);

            var serializer = new XMLSerializer();
            var str = serializer.serializeToString( result );

            tmpElt.innerHTML = str;
        }

        return tmpElt;
}

只要 xml 不是 HTMLElement,这将适用于 chrome.准确地说,这一行:

this will work on chrome as long as xml is not an HTMLElement. precisely, this line:

var result = xsltProcessor.transformToFragment(xml, document);

在 Chromium 上返回 null [大部分时间].在 Firefox 上它运行正常.

returns null on chromium[most of the time]. On Firefox it behaves properly.

我尝试了这个解决方法:

I tried this workaround:

  • 使用outerHTML(甚至使用XMLSerializer::serializeToString())序列化xml
  • 使用新的 DOMParser() 解析它
  • XSLT 结果

但不幸的是,outerHTML 和innerHTML 不会生成正确的XHTML,并且不会呈现有效的XML(它不会关闭像<hr/> 这样的单个标签),XMLSerializer 也赢了不关闭单个标签,这让我很惊讶.

but unfortunately outerHTML and innerHTML won't generate proper XHTML, and don't render valid XML ( it won't close single tags like <hr /> ).,XMLSerializer also won't close single tags, which is quite surprising to me.

我注意到当实际的 HTML 不包含任何自结束标记时,HTML 节点转换将异常有效.所以我怀疑 Chrome 在 XSLT 之前使用 XMLSerializer 或 outerHTML 内部序列化 HTML.

I noticed the HTML node transformations will exceptionnaly works when the actual HTML doesn't contain any self closing tags. So I supect Chrome to internally serialize the HTML with XMLSerializer or outerHTML before the XSLT.

这是 JSFiddle:http://jsfiddle.net/eVbv7/

Here's the JSFiddle: http://jsfiddle.net/eVbv7/

 

那么,我如何在 Chrome 上 XSLT HTML 节点?我需要一种正确序列化 XHTML 节点的方法,或者任何解决方法都可以.

So, how can I XSLT HTML nodes on Chrome? I need either a way to serialize XHTML nodes properly or any workaround will do.

推荐答案

我再次思考了这个问题,然后推测如果你只是创建一个虚拟的 XML DOM 文档然后 importNode 是否可能不需要对 Chrome 或 Webkit 进行自定义克隆或序列化HTML DOM 文档中的元素.所以我写了 http://jsfiddle.net/5TNH9/ 并且确实 Chrome 13 和 Safari 5.1 至少执行转变.因此,这可能是避免使用您自己的脚本代码完全实现序列化或克隆的另一种选择.

I pondered the problem again and then speculated whether you might not need custom cloning or serialization for Chrome or Webkit if you simply create a dummy XML DOM document and then importNode the element from the HTML DOM document. So I wrote http://jsfiddle.net/5TNH9/ and indeed both Chrome 13 and Safari 5.1 at least perform the transformation. So that might be another option to avoid implementing serialization or cloning completely with your own script code.

但是请注意,在 jsfiddle 上的那个测试用例中,Chrome 和 Safari 都出现了重复 br 元素的问题,而 Mozilla 或 Opera 不会出现这种问题.我目前无法判断该问题是我选择的方法的普遍问题还是特定于那个小测试用例的问题.

Note however that in that test case on jsfiddle both Chrome and Safari exhibit a problem with duplicated br elements that does not occur with Mozilla or Opera. I am currently not able to tell whether that problem is a general one with the approach I have chosen or something specific to that small test case.

这篇关于在 chrome/webkit 中使用 XSLT 转换 HTML 节点的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆