Firefox 扩展如何将本地 css 文件注入网页? [英] How can a Firefox extension inject a local css file into a webpage?

问题描述

我正在编写一个需要将 css 文件注入网页的 Firefox 扩展.css 文件与扩展程序捆绑在一起，因此我可以使用 chrome url 访问它

I'm writing a Firefox extension that needs to inject a css file into webpages. The css file is bundled with the extension, so I can access it using a chrome url

chrome://extensionid/content/skin/style.css

我正在尝试在页面加载时注入这样的 css:

I'm trying to inject css like this when the page is loaded:

var fileref = document.createElement("link");
fileref.setAttribute("rel", "stylesheet");
fileref.setAttribute("type", "text/css");
fileref.setAttribute("href", "chrome://extensionid/content/skin/style.css");
document.getElementsByTagName("head")[0].appendChild(fileref);

但是，当我检查我创建的 link 元素时，未加载 css 并且 Firebug 显示已过滤的 chrome url"消息而不是文件内容.如果我尝试从外部服务器加载此 css 文件，则一切正常.

However, the css isn't loaded and Firebug shows 'Filtered chrome url' message instead of the file content, when I inspect the link element I created. If I try to load this css file from an external server, everything's fine.

有没有办法加载与扩展捆绑在一起的 css 文件?

Is there are way to load a css file bundled with the extension?

推荐答案

使用 资源: 而不是 chrome:?

这篇关于Firefox 扩展如何将本地 css 文件注入网页?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！