【问题标题】:Adding StyleSheets to Firefox Bootstrapped Addon将样式表添加到 Firefox 引导插件
【发布时间】:2014-07-02 11:51:10
【问题描述】:

手风琴Using the Stylesheet Service

上述文件还指出:

如果 CSS 包含 #id,loadAndRegisterSheet 会失败。 '#' 必须是百分号编码,详情见 bug 659650。

行李报告于 2011-05-25 进行。它仍然是一个错误还是已经解决?

还有另一种添加 CSS 的方法,但这是针对每个窗口的,我更喜欢对此进行排序。

更新:
这是样式表的内容

#rpnethelper-separator2:last-child { display: none; }
#rpnethelper-menuitem {
  list-style-image: url('icon16.png');
}

这是实际代码(加上添加的控制台调用)

register: function(css) {

  let sss = Components.classes['@mozilla.org/content/style-sheet-service;1']
                  .getService(Components.interfaces.nsIStyleSheetService);
  let cssURI = Services.io.newURI(css, null, null);
  sss.loadAndRegisterSheet(cssURI, sss.USER_SHEET);
},

我用try{} catch{} 尝试过,但没有收到任何错误。
如何/在哪里可以查看USER_SHEET

现在,我将使用内联样式(不支持伪类),但我仍然想解决这个问题。

最终更新:
出于某种原因,不能与USER_SHEET 一起使用的代码,与AUTHOR_SHEET 一起工作正常
有趣的是,毕竟,我认为只为一个伪类进行额外处理是不值得的,所以我选择了(简单)内联样式

【问题讨论】:

  • 您的样式表的内容是什么,chrome://myext/content/myext.css 是一个有效的 URI,还是您忘记从相同的代码更改它?
  • 大声笑...不,URI 是有效的 ;) 我会将样式表的内容添加到帖子中。
  • 您仍然没有提供完整的、*可重现代码,只是一些或多或少的随机 sn-ps。我将如何运行它?我不能,因为我不知道何时/何地/如何调用register,那些rpnethelper 元素是什么,等等。
  • @nmaier .. 抱歉,我现在才看到这个.. 样式用于上下文 menuitemmenuseparator,该函数在 startup() 中调用...请阅读最终更新...感谢您的所有帮助:)

标签: javascript firefox firefox-addon firefox-addon-restartless


【解决方案1】:

您忘记指定正确的命名空间。将以下内容作为第一行添加到您的工作表中。

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

您已链接的文档状态:

使用此服务添加的样式表同时应用于 chrome 和内容文档。如果您想将样式表应用于 XUL 文档,请记住声明正确的命名空间。

另外,如果您的目标是 Firefox 18 及更高版本(实际上,支持早期版本没有任何好处,因为这些版本不受支持且包含已知的安全漏洞,因此用户不应使用它们),您应该考虑使用 @987654321 @ 反而。这只会将工作表加载到实际窗口中,而不是将其全局应用于所有窗口,包括。网站。

if (window instanceof Ci.nsIInterfaceRequestor) {
  let winUtils = window.getInterface(Ci.nsIDOMWindowUtils);
  let uri = Services.io.newURI(..., null, null);
  winUtils.loadSheet(uri, Ci.nsIDOMWindowUtils.AUTHOR_SHEET);
  // Remove with winUtils.removeSheet() again on shutdown
}

编辑您大部分时间都希望使用AUTHOR_SHEET(无论是使用样式表服务还是窗口实用程序)。这更等同于叠加层中的xml-stylesheet

loadAndRegisterSheet fails if CSS contains #id. '#' must be percent-encoded, details see bug 659650.

行李报告于 2011-05-25 进行。它仍然是一个错误还是已经解决?

该错误报告仅适用于 data: URI。此外,该错误报告是无效的,# 在 URI 中具有特殊含义,因此当它直接作为 URI 的一部分时,您必须对其进行编码(就像 data: URI 的情况一样)。如果您注册的是常规的chrome:/resource:/file:/http: URI,则不需要特殊编码。

【讨论】:

  • 感谢您澄清错误。我正在查看其他人添加到他们令人震惊的插件中的其他 css 示例,但他们都没有@namespace url()nsIDOMWindowUtils.loadSheet 是每个窗口,即它必须应用于每个窗口并删除,对吗?如果是这种情况,document.createProcessingInstruction 会更容易使用。我想避免在加载/卸载时为每个窗口添加/删除。
  • nsIDOMWindowUtils 是每个窗口的,并且必须在每个窗口中添加和删除,正确。你最后一句话好像不完整什么的……
  • createProcessingInstruction 是可能的,但并不容易。它也有一些缺点,最重要的是样式会异步加载,因此可能会导致闪烁。在这三个选项中,我会选择 nsIDOMWindowUtils 方式作为最好、最简单和最可靠的方式,createProcessingInstruction 排在第二位,全局样式表服务排在第三位。
  • 不确定全局样式表服务,但.loadSheet 注册的表单会显示在 DOM Inspector 中(当然,如果它们适用于元素)。
  • @Noitidart 您应该能够从内容窗口获取nsIDOMWindowUtils 实例,所以是的。我认为这实际上就是 SDK 在 PageMod 中实现 contentStyleFile 的方式。
猜你喜欢
  • 2012-04-01
  • 2016-04-10
  • 2019-12-05
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多