如何让 Firefox Greasemonkey 脚本使用本地级联样式表？

Question

链接到与 Greasemonkey JavaScript 相同目录中的 CSS 文件的正确语法是什么？我已经尝试了以下但它不起作用：

var cssNode = document.createElement('link');
cssNode.type = 'text/css';
cssNode.rel = 'stylesheet';
cssNode.href = 'example.css';
cssNode.media = 'screen';
cssNode.title = 'dynamicLoadedSheet';
document.getElementsByTagName("head")[0].appendChild(cssNode);

如果我能让它工作，它会比在 JavaScript 中包含 CSS 更改容易得多。

Answer 1

这对@resource指令很容易。像这样：

// ==UserScript==
// @name            _Use external CSS file
// @resource        YOUR_CSS  YOUR_CSS_File.css
// @grant           GM_addStyle
// @grant           GM_getResourceText
// ==/UserScript==

var cssTxt  = GM_getResourceText ("YOUR_CSS");

GM_addStyle (cssTxt);

在没有路径/url 信息的情况下，@resource在同一目录中查找“YOUR_CSS_File.css”。

Answer 2

尝试这个！

\n\n

function addStyleSheet(style){\n  var getHead = document.getElementsByTagName("HEAD")[0];\n  var cssNode = window.document.c\xc2\xadreateElement( \'style\' );\n  var elementStyle= getHead.appendChild(cssNode)\n  elementStyle.innerHTML = style;\n  return elementStyle;\n}\n\n\naddStyleSheet(\'@import "example.css";\'); \n

\n\n

注意：example.css 必须与您的用户脚本位于同一目录中，此示例才能正常工作。

\n\n

参考-> DiveIntoGreaseMonkey

\n