标签：javascript xml xslt greasemonkey
我有一个搜索服务器,它提供了一个测试页面,我可以在其中输入查询,并以XML格式返回结果.我希望能够以更加用户友好的方式完成结果,所以我开始使用XSLT,现在我有一个简单的样式表,将某种臃肿的XML变成一个简单的表格,只显示一些数据.这在我本地执行时工作正常 – 也就是说,将XSL声明添加到XML,然后在Firefox等浏览器中打开XML.
我想做的是,只要我通过该测试页面从服务器获取结果,就可以在浏览器中实时应用此转换.我调查了一下,发现it’s possible to do this with javascript.
然后我想到了可以动态地将javascript注入页面的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文件或来自我的服务器的任何XML.(我知道要使Greasemonkey与本地文件一起工作,需要在about中更改设置：在Firefox中配置 – extensions.greasemonkey.fileIsGreaseable ).
我没有任何javascript经验所以我很可能只是犯了一个非常基本的错误.万一,所有的帮助真的很感激.
解决方法:
该脚本是nuking或添加到document.head.您希望用已转换的内容替换整个文档.您可以通过将location.href更改为适当构造的数据：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,xml,xslt,greasemonkey 来源： https://codeday.me/bug/20191008/1875054.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。