0

我有一个 chrome 内容脚本扩展,其中包含一个捆绑到扩展 CRX 中的 css 文件 (mystyle.css)。据我所知,有两种方法可以将此样式表注入到页面内容中。

无论样式表以哪种方式注入页面,我都无法访问与该样式表关联的 CSS 规则。

注入方法#1:

// From a script running in the context of background.html:
chrome.tabs.insertCSS(tab.id, {file: 'mystyle.css'});

注入方法#2:

// From a script running in the context of the content, already
// injected by the background page via chrome.tabs.executeScript.
var fileref = document.createElement("link");
fileref.setAttribute("rel", "stylesheet");
fileref.setAttribute("type", "text/css");
fileref.setAttribute("href",
    chrome.extension.getURL('mystyle.css'));

从在内容上下文中运行的 JavaScript 中,由后台页面注入,当使用方法 #1 注入样式表时,我无法在 document.styleSheets 中列出的列表中看到样式表。当使用方法 #2 注入时,它会与 chrome-extension:// href 一起列出,但该工作表的 cssRules 属性始终为空。

对于链接到来自其他域的文档的 CSS 工作表,我希望这是这样,但我的脚本应该可以访问与我的扩展相关的 chrome-extension:// URI。

我目前正在调查的途径是对 CSS 文件的资源内容的原始字符串访问,我可以为其构建一个 chrome-extension:// URI。我不知道这是否会比其他尝试更好,但似乎应该这样做。

4

0 回答 0