我如何删除注入的CSS文件？ [英] How do I remove an injected CSS file?

问题描述

我使用 chrome.tabs.insertCSS（null，{file：style.css}）; 在页面中插入一个css文件，并且它工作正常。

• 但是有没有办法删除文件？


• 另外，如果我注入另一个文件命名为 style.css ，它是否覆盖第一个？


• 顺便说一下，我可以在哪里看到注入的CSS文件？脚本可以在源代码/内容脚本（铬合作开发工具）中查看，但我找不到CSS文件。 解决方案

我不确定这个问题的上下文是什么，但是这听起来像是想要以某种方式突出显示页面的特定元素，并能够切换该自定义突出显示。 （而不是你的扩展将创建的样式元素）

因为你实际上不能删除CSS文件或者只是通过添加一个同名的文件来删除它，所以我建议如下所示：

• 将您的自定义样式封装在 body.JMaylinCustomStyles


• 使用JavaScript将 JMaylinCustomStyles 类添加或移除到 body 元素。 / li>
  
• 没有第三步。

/ b>



好处是它不会增加太多工作除了你所拥有的东西之外，你不必弄清楚如何在第二个样式表中覆盖你的自定义样式（它总是非常烦人和容易出错），而且你甚至会在 CSS特异性，所以你的风格更可能被应用。





请注意，包装样式的最佳方法是使用 Sass 或 LESS ，因为你可以直接添加 body .JMaylinCustomStyles {位于文件顶部，} 位于底部。




I use chrome.tabs.insertCSS(null, {file: "style.css"}); to insert a css file into the page, and it works fine.

• But is there a way to remove the file?
• Also, if I inject another file named style.css, does it override the first one?
• And by the way, where can I see the injected CSS files? Scripts can be viewed in "Sources/Content Scripts" (of chrome developer tools), but I cannot find the CSS files.

解决方案

I'm not sure what the context of this question is, but it sounds like maybe you want to highlight specific elements of the page a certain way and be able to toggle that custom highlight. (rather than styling elements your extension would create)

Since you can't actually remove the CSS file or just erase it by adding a file with the same name, I suggest the following:

• wrap your custom styles in something like body.JMaylinCustomStyles
• use JavaScript to add or remove the JMaylinCustomStyles class to the body element.
• there is no step 3.

The benefits are that it doesn't add much work on top of what you have, that you don't have to figure out how to override your custom styles in a second stylesheet (it's always very annoying and error-prone) and that you even gain a bit in CSS specificity so your styles are more likely to be applied.

Note that the best way to "wrap" your styles would be to use Sass or LESS since you can literally just add body.JMaylinCustomStyles { at the top of the file and } at the bottom.

这篇关于我如何删除注入的CSS文件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！