好久没写复杂的XSLT了,最近在编写新的文件上传下载模块的例子时,才编写了比较复杂的XSLT。结果发现xsl:comment在IE和FF中处理不一样,导致在其中的JS代码无法很好的跨这两个浏览器运行。
比如我们通常会这样来写一个XSLT:
这个XSLT在IE中能够正确执行,但在FF中就无法执行了。然后我将其中的xsl:comment去掉后,发现在FF中能够执行,而在IE中则报JS错误。这可是一件郁闷的事情,这意味着即使我们考虑了所有其他的JS和HTML、CSS等等跨浏览器需求后,仍然由于这么一个小小的问题而导致我们辛苦编写的XSLT无法跨这两个浏览器执行。
后来我想起xsl中还有xsl:text元素,然后我就测试了一下,结果有惊喜的发现,只要将xsl:comment改为xsl:text,并设置disable-output-escaping为yes就能够实现跨浏览器。如下:
----------
这篇文章是以前发布在公司内部论坛上的,现在转出来。
比如我们通常会这样来写一个XSLT:
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN"
doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"/>
<xsl:template match="/">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/xhtml; charset=UTF-8" />
<title>XSL:COMMENT Example</title>
<script type="text/javascript" charset="UTF-8">
<xsl:comment><![CDATA[
function sayHello() {
alert("Hello!");
}
]]></xsl:comment>
</script>
</head>
<body>
<a onclick="sayHello()">Click me!</a>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
这个XSLT在IE中能够正确执行,但在FF中就无法执行了。然后我将其中的xsl:comment去掉后,发现在FF中能够执行,而在IE中则报JS错误。这可是一件郁闷的事情,这意味着即使我们考虑了所有其他的JS和HTML、CSS等等跨浏览器需求后,仍然由于这么一个小小的问题而导致我们辛苦编写的XSLT无法跨这两个浏览器执行。
后来我想起xsl中还有xsl:text元素,然后我就测试了一下,结果有惊喜的发现,只要将xsl:comment改为xsl:text,并设置disable-output-escaping为yes就能够实现跨浏览器。如下:
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN"
doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"/>
<xsl:template match="/">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/xhtml; charset=UTF-8" />
<title>XSL:COMMENT Example</title>
<script type="text/javascript" charset="UTF-8">
<xsl:text disable-output-escaping="yes"><![CDATA[
function sayHello() {
alert("Hello!");
}
]]></xsl:text>
</script>
</head>
<body>
<a onclick="sayHello()">Click me!</a>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
----------
这篇文章是以前发布在公司内部论坛上的,现在转出来。