如何在chrome扩展中使用javascript生成CSS文件？

我正在尝试做一个chrome扩展，允许用户在页面上选择背景颜色或字体，并根据他的选择生成一个CSS文件。然后文件将被注入页面

我已经尝试过编写一些单独的函数，每个函数都针对不同的元素，它工作得很好，但是1）更改没有保存在页面上，2）函数是冗余的，3）我不知道如何从中生成CSS文件

这是我已经编写的内容脚本中的代码块（每个函数看起来都有点类似）：

我还知道，要从chrome扩展向页面注入CSS，我可以使用：

chrome.tabs.insertCSS(tabId, {
 file : "mystyle.css"
});

我真的想生成一个CSS文件，而不是一个接一个地更改文档属性；但是怎么做

---

任何帮助都将不胜感激。

简而言之，Chrome扩展无法写入任意本地文件，除非求助于nativeMessaging之类的解决方案来运行一个单独的实用程序来完成这些脏活，或者使用自Chrome 86以来最先进的本机文件系统API。您可以将chrome.tabs.insertCSS与文本

code

一起使用，以插入生成的代码。要自动应用它，请使用chrome.storage和chrome.tabs.onUpdated或chrome.webNavigation.onCommitted@wOxxOm我考虑过，但是此扩展的主要目标是生成某种CSS，我可以以.CSS文件形式下载，insertCSS是次要的property@wOxxOm我想做一些类似Stylebot（）的东西，但要简单得多，对于其他一些选项，如果没有monaco编辑器且仅用于个人用途，下载将是一个微不足道的添加，请参阅从JS下载生成文本的示例。简而言之，Chrome扩展无法写入任意本地文件，除非求助于nativeMessaging之类的解决方法来运行一个单独的实用程序来完成这些脏活，或者使用Chrome 86以来最先进的本地文件系统API。您可以将chrome.tabs.insertCSS与文本

code

一起使用，以插入生成的代码。要自动应用它，请使用chrome.storage和chrome.tabs.onUpdated或chrome.webNavigation.onCommitted@wOxxOm我考虑过，但是此扩展的主要目标是生成某种CSS，我可以以.CSS文件形式下载，insertCSS是次要的property@wOxxOm我想做一些类似Stylebot（）的东西，但要简单得多，对于其他一些选项，如果没有monaco编辑器且仅用于个人用途，下载将是一个微不足道的添加，请参阅从JS下载生成文本的示例。

chrome.tabs.insertCSS(tabId, {
 file : "mystyle.css"
});