我想使用 JavaScript 来显示我的 XSLT，但在我的服务器上，浏览器中没有显示任何内容。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="main.js"></script>
<meta http-equiv="Content-Language" content="en-us"/>
<title>Contracting, Licensing and Compliance News</title>
</head>
<body>
<script language="javascript">
function displayMessage() {
// Load XML
var xml = new ActiveXObject("Microsoft.XMLDOM")
xml.async = false
xml.load("site-index.xml")
// Load the XSL
var xsl = new ActiveXObject("Microsoft.XMLDOM")
xsl.async = false
xsl.load("site-index.xsl")
// Transform
document.write(xml.transformNode(xsl))
}
</script>
</body>
</html>
最佳答案
您最好允许浏览器使用 Xenan 概述的方法执行转换。然而，在 JavaScript 中也完全可以做到这一点。下面概述了如何以跨浏览器的方式完成此操作。
首先，您需要加载 XML 和 XSL。有很多方法可以做到这一点。通常，它会涉及某种 AJAX，但不一定。为了让这个答案简单明了，我假设您已经涵盖了这部分，但如果您需要更多帮助，请告诉我，我将编辑以包含一个加载 XML 的示例。
因此，让我们假设我们有这些对象:
var xml, xsl;
其中 xml 包含 XML 结构，xsl 包含您希望用来转换的样式表。
编辑:
如果您需要加载这些对象，您最终将使用某种形式的 AJAX 来执行此操作。那里有很多跨浏览器 AJAX 的例子。你最好使用一个库来完成这个，而不是推出你自己的解决方案。我建议您研究一下 jquery 或 YUI，它们在这方面都做得很好。
然而，基本思想非常简单。为了完成这个答案，这里有一些非库特定的代码以跨浏览器的方式完成这个:
function loadXML(path, callback) {
var request;
// Create a request object. Try Mozilla / Safari method first.
if (window.XMLHttpRequest) {
request = new XMLHttpRequest();
// If that doesn't work, try IE methods.
} else if (window.ActiveXObject) {
try {
request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e1) {
try {
request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e2) {
}
}
}
// If we couldn't make one, abort.
if (!request) {
window.alert("No ajax support.");
return false;
}
// Upon completion of the request, execute the callback.
request.onreadystatechange = function () {
if (request.readyState === 4) {
if (request.status === 200) {
callback(request.responseXML);
} else {
window.alert("Could not load " + path);
}
}
};
request.open("GET", path);
request.send();
}
您可以通过为其提供 XML 路径和加载完成时执行的函数来使用此代码:
loadXML('/path/to/your/xml.xml', function (xml) {
// xml contains the desired xml document.
// do something useful with it!
});
我已经更新了我的例子来展示这个技术。您可以找到一些有效的演示代码 here .
要执行转换，您将得到第三个 XML 文档，它是该转换的结果。如果您使用 IE，则使用“transformNodeToObject”方法，如果您使用其他浏览器，则使用“transformToDocument”方法:
var result;
// IE method
if (window.ActiveXObject) {
result = new ActiveXObject("MSXML2.DOMDocument");
xml.transformNodeToObject(xsl, result);
// Other browsers
} else {
result = new XSLTProcessor();
result.importStylesheet(xsl);
result = result.transformToDocument(xml);
}
此时，result 应该包含转换结果。这仍然是一个 XML 文档，您应该这样对待它。如果您想要一个可以传递给 document.write 或 innerHTML 的字符串，您还有一些工作要做。
再说一遍，这个有一个IE的方法，还有一个适用于其他浏览器的方法。
var x, ser, s = '';
// IE method.
if (result.childNodes[0] && result.childNodes[0].xml) {
for (x = 0; x < result.childNodes.length; x += 1) {
s += result.childNodes[x].xml;
}
// Other browsers
} else {
ser = new XMLSerializer();
for (x = 0; x < result.childNodes.length; x += 1) {
s += ser.serializeToString(result.childNodes[x]);
}
}
现在 s 应该包含作为字符串的结果 XML。您应该能够将它传递给 document.write 或 innerHTML 并让它做一些有用的事情。请注意，它可能包含一个 XML 声明，您可能希望将其删除或不删除。
我已经在 Chrome、IE9 和 FF4 中对此进行了测试。你可以找到一个简化的准系统，working example of this in my testbed .
祝你好运，编码愉快!
关于javascript - 如何使用 JavaScript 转换 XML 和 XSLT？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5722410/