我有一个搜索服务器，它提供一个测试页面，我可以在其中输入查询并以 XML 形式返回结果。我希望能够以更加用户友好的方式浏览结果，因此我开始使用 XSLT，现在我有了一个简单的样式表，可以将不知何故臃肿的 XML 转换为仅显示部分数据的简单表格。当我在本地执行此操作时，效果很好 - 即，将 XSL 声明添加到 XML，然后在 Firefox 等浏览器中打开 XML。
我想做的是在通过该测试页面从服务器获取结果后立即在浏览器中应用此转换。我调查了一下，发现 it's possible to do this with javascript 。
然后我想到了可以动态地将 JavaScript 注入(inject)页面的 Greasemonkey 用户脚本。我只需要一个脚本，当我从测试页获取 XML 结果时，该脚本就会启动。然而，我被困在那里，因为 Greasemonkey 似乎不允许脚本在 XML 文件上运行(至少在 Firefox 中)。
我发现的例子很少，并尝试将它们用作灵感，但无法使它们发挥作用。 ( Here's one, for example 。)
这是我得到的 XML 的简化示例:
<?xml version="1.0" encoding="utf-8"?>
<Results>
<Result>
<Listings total="2">
<Res>
<Result index="0">
<id>123456</id>
<name>My Business</name>
<category>Restaurants</category>
<phone>9872365</phone>
</Result>
</Res>
<Res>
<Result index="1">
<id>876553</id>
<name>Some Other Business</name>
<category>Restaurants</category>
<phone>9834756</phone>
</Result>
</Res>
</Listings>
</Result>
</Results>
这是我在 Greasemonkey 中加载的脚本 - 没有发生任何事情:
// ==UserScript==
// @name test xml renderer
// @namespace http://sample.com
// @description stylesheet for xml results
// @include *
// ==/UserScript==
(function () {
var xsl_str = '<?xml version="1.0" encoding="utf-8"?>\n\
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">\n\
<xsl:output method="html"/>\n\
<xsl:template match="/">\n\
<html>\n\
<head></head>\n\
<body>\n\
<table id="results" border="1" cellspacing="0" cellpadding="0">\n\
<thead>\n\
<tr>\n\
<th class="name">id</th>\n\
<th class="name">category ID</th>\n\
<th class="name">name</th>\n\
<th class="name">phone</th>\n\
</tr>\n\
</thead>\n\
<tbody>\n\
<xsl:for-each select="Results/Result/Listings/Res">\n\
<tr>\n\
<td class="small" width="120">\n\
<xsl:value-of select="Result/id"/>\n\
</td>\n\
<td class="small" width="120">\n\
<xsl:value-of select="Result/category"/>\n\
</td>\n\
<td class="small" width="120">\n\
<xsl:value-of select="Result/name"/>\n\
</td>\n\
<td class="small" width="120">\n\
<xsl:value-of select="Result/phone"/>\n\
</td>\n\
</tr>\n\
</xsl:for-each>\n\
</tbody>\n\
</table>\n\
</body>\n\
</html>\n\
</xsl:template>\n\
</xsl:stylesheet>\n\
';
var processor = new XSLTProcessor();
var dataXSL = new DOMParser().parseFromString(xsl_str, "text/xml");
processor.importStylesheet(dataXSL);
dataXML = document;
var ownerDocument = document.implementation.createDocument("", "", null);
var newFragment = processor.transformToFragment(dataXML, ownerDocument);
dataXML.documentElement.replaceChild(newFragment, dataXML.documentElement.firstChild);
})();
当我在 Greasemonkey 中启用此脚本时，所有页面都会成功替换为 XSL 模板中的上述 HTML。然而，它似乎不适用于本地 XML 文件或来 self 的服务器的任何 XML。(我知道要使 Greasemonkey 使用本地文件，需要在 about:config 中更改设置Firefox - extensions.greasemonkey.fileIsGreaseable)。
我没有任何 JavaScript 经验，所以很可能我只是犯了一个非常基本的错误。以防万一，非常感谢所有的帮助。
最佳答案
该脚本正在破坏或添加到document.head。您想要用转换后的内容替换整个文档。您可以通过将location.href更改为适当构造的data: URL来做到这一点。但更简洁的方法是替换整个document.documentElement。
此脚本适用于您的测试/示例 XML 文件:
// ==UserScript==
// @name _Test XML Renderer
// @description stylesheet for xml results
// @include http://YOUR_SERVER.COM/YOUR_PATH/*.xml
// @grant none
// ==/UserScript==
var xsl_str = '<?xml version="1.0" encoding="utf-8"?>\n\
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">\n\
<xsl:output method="html"/>\n\
<xsl:template match="/">\n\
<html>\n\
<head></head>\n\
<body>\n\
<table id="results" border="1" cellspacing="0" cellpadding="0">\n\
<thead>\n\
<tr>\n\
<th class="name">id</th>\n\
<th class="name">category ID</th>\n\
<th class="name">name</th>\n\
<th class="name">phone</th>\n\
</tr>\n\
</thead>\n\
<tbody>\n\
<xsl:for-each select="Results/Result/Listings/Res">\n\
<tr>\n\
<td class="small" width="120">\n\
<xsl:value-of select="Result/id"/>\n\
</td>\n\
<td class="small" width="120">\n\
<xsl:value-of select="Result/category"/>\n\
</td>\n\
<td class="small" width="120">\n\
<xsl:value-of select="Result/name"/>\n\
</td>\n\
<td class="small" width="120">\n\
<xsl:value-of select="Result/phone"/>\n\
</td>\n\
</tr>\n\
</xsl:for-each>\n\
</tbody>\n\
</table>\n\
</body>\n\
</html>\n\
</xsl:template>\n\
</xsl:stylesheet>\n\
';
var processor = new XSLTProcessor ();
var dataXSL = new DOMParser ().parseFromString (xsl_str, "text/xml");
processor.importStylesheet (dataXSL);
var newDoc = processor.transformToDocument (document);
//-- These next lines swap the new, processed doc in for the old one...
window.content = newDoc;
document.replaceChild (
document.importNode (newDoc.documentElement, true),
document.documentElement
);
关于javascript - 如何使用 Greasemonkey 脚本通过 XSLT 转换 XML 文件？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17998446/