我创建了一个Practice.xsl文件,将源Practice.xml转换为来自javascript的html,并将生成的html添加到n个空DIV元素,这对IE工作正常 但是Firefox上没有正确呈现相同的html。
这是Practice.xml
<feed>
<feedback>
<user>Naresh</user>
<date>12 Oct, 2009</date>
<comments>This blog has no stuff to rate it</comments>
</feedback>
<feedback>
<user>Pokuri</user>
<date>21 Dec, 2009</date>
<comments>Naresh is right</comments>
</feedback>
<feedback>
<user>Subbu</user>
<date>30 Dec, 2009</date>
<comments>I don't agree with both Naresh n Pokuri</comments>
</feedback>
</feed>
这是Practice.xsl
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
<xsl:output method="html" indent="yes"/>
<xsl:template match="feed/feedback">
<html>
<head>
<title>Feedback Forum</title>
</head>
<body>
<span style="display:block; padding: 5px 10px; background-color: #C9F0F9; width: 100%; margin-top:10px; border-left:10px solid #F9EBC9; border-bottom: 1px solid #000000;"><xsl:apply-templates select="user"/> on <xsl:apply-templates select="date"/></span>
<span style="display:block; padding: 5px 10px; background-color: #CDF5CD; width: 100%; border-left:10px solid #F9EBC9;"><xsl:apply-templates select="comments"/></span>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
这是用于在Firefox上进行XSLT转换的javascript
function listOrders(){
var XSLT = loadXSLT("Practice.xsl");
var trasformedText;
if(window.ActiveXObject){
trasformedText = XMLDOM.transformNode(XSLT);
document.getElementById("rightDIV").innerHTML=trasformedText;
} else if(document.implementation && document.implementation.createDocument){
**xsltProcessor = new XSLTProcessor();
xsltProcessor.importStylesheet(XSLT);
trasformedText = xsltProcessor.transformToFragment(XMLDOM, document);
document.getElementById("rightDIV").appendChild(trasformedText);**
} else {
alert("Sorry your browser may not support xsl transformation.\n+Please check your browser documentation for further help");
}
}
专业人士轻松识别问题的相关图像
在Firefox中: http://img97.imageshack.us/img97/8509/firefoxk.jpg
答案 0 :(得分:1)
查看生成的HTML源代码。看起来不错吗?您为每个 <html>
显示了一个完整的feedback
页面,而不是仅显示每个<span>
的{{1}}。
对于每个反馈,您需要使用feedback
更改XSL:
<xsl:for-each>
IE在一个响应中显示多个<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
<xsl:output method="html" indent="yes"/>
<xsl:template match="feed">
<html>
<head>
<title>Feedback Forum</title>
</head>
<body>
<xsl:for-each select="feedback">
<span style="display:block; padding: 5px 10px; background-color: #C9F0F9; width: 100%; margin-top:10px; border-left:10px solid #F9EBC9; border-bottom: 1px solid #000000;"><xsl:apply-templates select="user"/> on <xsl:apply-templates select="date"/></span>
<span style="display:block; padding: 5px 10px; background-color: #CDF5CD; width: 100%; border-left:10px solid #F9EBC9;"><xsl:apply-templates select="comments"/></span>
</xsl:for-each>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
太宽容了,这就是它在这个浏览器中工作的原因。 Firefox更严格地遵守标准:DOM中只能有一个 <html>
元素。
答案 1 :(得分:0)
我知道这并没有真正回答这个问题,但是客户端xslt转换非常冒险,并且你不能保证很多的一致性。如果我是你,我会考虑使用服务器端XSLT转换。
答案 2 :(得分:0)
可能是Firefox加载xsl文件的速度慢。所以我做了以下代码更改以应对它,我忽略了因为文件很小。
写了这个声明 XMLDOM.async = FALSE; XSLT.async = FALSE;
function loadXML(){
var XMLDOM;
// if it is IE
if(window.ActiveXObject){
XMLDOM = new ActiveXObject("Microsoft.XMLDOM");
// following staement added
XMLDOM.async=false;
XMLDOM.load("Practice.xml");
} else if(document.implementation && document.implementation.createDocument){
XMLDOM = document.implementation.createDocument("", "", null);
// following staement added
XMLDOM.async=false;
XMLDOM.load("Practice.xml");
} else {
alert("Sorry your browser may not support loading an external file.\n+Please check your browser documentation for further help");
}
return XMLDOM;
}
function loadXSLT(xsltFile){
var XSLT;
// if it is IE
if(window.ActiveXObject){
XSLT = new ActiveXObject("Microsoft.XMLDOM");
// following staement added
XSLT.async=false;
XSLT.load(xsltFile);
} else if(document.implementation && document.implementation.createDocument){
XSLT = document.implementation.createDocument("", "", null);
// following staement added
XSLT.async=false;
XSLT.load(xsltFile);
} else {
alert("Sorry your browser may not support loading an external file.\n+Please check your browser documentation for further help");
}
return XSLT;
}