我正在创建一个 Chrome 扩展，我想将 CSS 应用到 <head> 的底部在 html 中。
这是我的代码
"content_scripts" : [ {
"matches": ["*://*.roblox.com/*"],
"js": ["inject.js"],
"run_at": "document_start",
"css": [ "obc.css" ]
} ]
每当我运行它时，它都不会将 CSS 放在头部底部。 有移动 CSS 的想法吗？
最佳答案
首先，将其添加到 mainfest 文件中:
"content_scripts": [{
"matches": ["*://*.roblox.com/*"],
"js": ["inject.js"],
"run_at": "document_end"
}],
"web_accessible_resources": [
"obc.css"
],
并且，在 inject.js 中:
var linkElem = document.createElement('link'),
cssSrc = chrome.extension.getURL('inject.css'),
head = document.getElementsByTagName('head')[0];
// Normal html will only have one head element, so, use [0] is ok, right?
linkElem.setAttribute('rel', 'stylesheet');
linkElem.setAttribute('href', cssSrc);
head.appendChild(linkElem);
最后，请检查您已将“document_start”更改为“document_end”，否则您将获得未定义的头部元素
关于css - 如何将 CSS 添加到页面到 <head> 自定义 chrome 扩展的底部，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36074469/