内容样式未应用于来自 GitHub 的文本文件答案

【问题标题】：Content style is not getting applied to text files from GitHub内容样式未应用于来自 GitHub 的文本文件
【发布时间】：2014-01-29 06:45:30
【问题描述】：

我创建了Google Chrome extension，它将（默认隐藏）文本区域插入到文档中。

它出现在所有页面上。当页面是 HTML 时没关系，但在其他页面上它是无用的。例如，当我打开 https://raw2.github.com/github/hubot/master/README.md 时，我可以看到 textarea，即使它有 display: none !important 样式（通过类）。它应该被隐藏，但事实并非如此。

如何防止这种奇怪的情况发生？也许检查文档类型（是 HTML）？

【问题讨论】：

How can I detect the current tab's mime type in a Google Chrome extension?的可能重复
@ZDroid，您的问题是由与文档类型完全不同的东西引起的。您能否编辑您的问题以提出您真正的问题，而不是您认为导致问题的原因？
@RobW 获取源代码并尝试使用 GitHub Raw 页面。我会尝试本杰明发布的问题的解决方案。
@ZDroid 我已经得到了源代码。而且我发现您问错了问题，问题与文档类型无关。我相信您真正想要的是以正确的方式隐藏该文本框。
是的，我正在以正确的方式这样做，但仅适用于 HTML。我想把它隐藏在其他文档上，比如 Markdown。 :)

标签： javascript css google-chrome google-chrome-extension

【解决方案1】：

内容脚本样式似乎不适用于以 MIME 类型 text/plain 提供的文件。这显然是一个错误，所以我在 Chromium 的错误跟踪器上报告了它，请参阅 issue 333234。

解决该问题的方法是在文档中插入一个普通的 <style> 元素：

document.head.appendChild(document.createElement('style'));

这在您的具体示例中不起作用，因为内联和外部样式表被 Github 的 Content Security Policy (default-src 'none') 阻止。
我能想到的唯一解决方法是通过 JavaScript 直接应用样式表：

textarea.style.display = 'none';
// Or,
textarea.style.cssText = 'display:none;';

【讨论】：

我刚刚询问了这个具体问题。另外，你不必担心我的意见。我在旁注中有我做事的理由。 Storage API 正在实现中，我不知道你为什么担心这个。
@ZDroid 不用担心，只要指向它们以防您（或其他人）不知道。将扩展数据存储在其他网页的存储空间中往往并不理想。我不会详细介绍，因为你说你知道得更好。您希望我删除最后一部分（旁注，与具体问题无关）吗？
我没这么说。哇。做你想做的，呆在里面是可以的，但是对于阅读这个问题的新dudes来说完全没用。 :)
固定在github.com/ZDroid/restilizr/commit/…。工作。