Добавление JavaScript в файл XML, преобразованный с помощью XSLT с использованием скрипта Greasemonkey
Как ответить на мой вопрос здесь -Как преобразовать файл XML с помощью XSLT, используя скрипт Greasemonkey? - Я сталкиваюсь с другой проблемой:
Я хочу использовать некоторые базовые функции JavaScript в моем шаблоне XSL, чтобы управлять отображением некоторых элементов div. Однако, как бы я ни включал эти функции javascript, они, похоже, не распознаются. Я уже много исследовал, но я не могу обойти это.
Я попробовал 2 вещи:
Добавление JavaScript в шаблон XSL в<script>
тегДобавление нового<script>
тег в самом скрипте GreasemonkeyЯ бы предпочел не использовать jQuery или внешний JS-файл (который я тоже пробовал), чтобы сделать его как можно более простым, но если это решит проблему, я готов изменить все это!
В любом случае, когда я вызываю функцию, я получаюReferenceError: x is not defined
, Тем не менее, я вижу, что javascript-код прекрасно расположен в конечном HTML-результате. Когда я использую Firebug, чтобы добавить новый<script>
тег с простой функцией, которая предупреждает «привет» на простой HTML-странице, то он работает отлично. Только когда это делается поверх XSLT-преобразования, все идет не так (для простоты я просто использую простую функцию для отображения окна предупреждения).
Вот мои примеры данных:
<?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>
Вот первая попытка, где я только что добавил<script>
тег в<head>
тег:
// ==UserScript==
// @name _Test XML Renderer
// @description stylesheet for xml results
// @include *
// @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><script type="text/javascript">function hello() {alert("hello")};</script></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\
<a href="#" onclick="hello()"><xsl:value-of select="Result/id"/></a>\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
);
Вот моя другая попытка, где я добавляю функцию "привет" вне шаблона XSL:
// ==UserScript==
// @name _Test XML Renderer
// @description stylesheet for xml results
// @include *
// @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\
<a href="#" onclick="hello()"><xsl:value-of select="Result/id"/></a>\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);
var script = "function hello() {alert('hello')};";
var newElem = newDoc.createElement('script');
newElem.type = 'text/javascript';
newElem.appendChild(newDoc.createTextNode(script));
newDoc.getElementsByTagName('head').item(0).appendChild(newElem);
//-- 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
);