【发布时间】：2023-03-18 11:27:01
【问题描述】：
我正在尝试使用 Javascript 转换 XSLT，并尝试让它在 Chrome 和 IE 上运行。入口页面是a.html。它在 IE 中运行良好（本机/兼容模式），但在 Chrome 中无法正常运行，即下拉菜单不是使用选项创建的。
但是，在 chrome 中，如果我打开 data.xml，其中有：
<?xml-stylesheet type="text/xsl" href="render.xslt" ?>
直接在 chrome 中，它被转换得非常好。但是，如果我尝试使用 XSLTProcessor 来做同样的事情，它就行不通了。具体来说，document 函数不起作用。你能帮忙吗？
我的代码如下。
Javascript：
var MSXML2_DOMDocument_6 = "MSXML2.DOMDocument.6.0";
function tranform(xml, xsl) {
if (window.ActiveXObject || "ActiveXObject" in window) {
var xmlSerializer = new XMLSerializer();
var xmlString = xmlSerializer.serializeToString(xml);
var xslString = xmlSerializer.serializeToString(xsl);
var xsl = new ActiveXObject(MSXML2_DOMDocument_6);
xsl.setProperty("AllowXsltScript", true);
xsl.setProperty("AllowDocumentFunction", true);
xsl.resolveExternals = true;
xsl.async = false;
xsl.loadXML(xslString);
var xml = new ActiveXObject(MSXML2_DOMDocument_6);
xml.resolveExternals = true;
xml.preserveWhiteSpace = true;
xml.async = false;
xml.loadXML(xmlString);
xml.resolveExternals = true;
ex = xml.transformNode(xsl);
document.getElementById("example").innerHTML = ex;
} else if (document.implementation && document.implementation.createDocument) {
xsltProcessor = new XSLTProcessor();
xsltProcessor.importStylesheet(xsl);
resultDocument = xsltProcessor.transformToFragment(xml, document);
document.getElementById("example").appendChild(resultDocument);
}
}
function loadXMLDoc() {
$.ajax({
method: "GET",
url: "data.xml",
dataType: "xml"
}).then(function (xml) {
console.log("done xml")
$.ajax({
method: "GET",
url: "render.xslt",
dataType: "xml"
}).then(function (xsl) {
console.log("done xsl")
tranform(xml, xsl)
})
},
function (e) {
console.log("Got error in xml", e.status)
})
}
$(loadXMLDoc)
foo/b.xml：
<dropdowns>
<dropdown name="xyz">
<option value="I">Info</option>
<option value="C">Category</option>
</dropdown>
</dropdowns>
data.xml：
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="render.xslt" ?>
<catalog name="xyz" />
a.html:
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="jquery-3.3.1.js"></script>
<title>Document</title>
</head>
<body>
<div id="example"></div>
<script src="b.js"></script>
</body>
</html>
render.xslt：
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:import href="util.xslt" />
<xsl:output method="html"></xsl:output>
<xsl:template match="/">
<h1>
<xsl:value-of select="/catalog/@name"></xsl:value-of>
</h1>
<xsl:call-template name="dropdown">
<xsl:with-param name="listname">xyz</xsl:with-param>
<xsl:with-param name="value" select="/catalog/@name"/>
</xsl:call-template>
</xsl:template>
</xsl:stylesheet>
util.xslt：
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet
xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output method="html"></xsl:output>
<xsl:template name="dropdown">
<xsl:param name="listname"/>
<xsl:param name="value"/>
<select>
<xsl:for-each select="document('foo/b.xml')/dropdowns/dropdown[@name=$listname]/option">
<option>
<xsl:attribute name="value">
<xsl:value-of select="@value"/>
</xsl:attribute>
<xsl:value-of select="."/>
</option>
</xsl:for-each>
</select>
</xsl:template>
</xsl:stylesheet>
很抱歉，作为 MVE 示例有点长，但它已经完成了。
如果需要任何澄清，请告诉我。
【问题讨论】：
-
您可以尝试给
document()一个绝对URI 参数（或者使用xml:base来设置上下文URI）吗？如果它与<?xml-stylesheet?>一起工作，那么 URI 的组合可能会出错。控制台是否给出错误消息？ -
我用绝对网址试过了，还是不行。控制台为
render.xslt和util.xslt提供Resource interpreted as Stylesheet but transferred with MIME type application/xslt+xml:。这会是问题的原因吗？ -
我不知道。根据stackoverflow.com/questions/6715767/…，预期的内容类型应该是
text/xsl，因此您可以尝试告诉您的网络服务器使用它来传递.xsl文件（尽管我怀疑它会有所帮助） -
@imhotap - 是否可以在任何地方将其设置为
text/xsl？ -
Chrome 的安全策略似乎不允许导入或文档引用。
标签： xml google-chrome xslt