javascript - 链接到程序生成的 CSS,就好像它是一个外部文件一样?

标签 javascript jquery html css

我正在使用 JavaScript 在运行时为 CSS 文件生成文本。我知道我可以通过将此 CSS 包含在 <style> 中来将其添加到 HTML 文档中标签,但它是一个大文件,如果将它作为外部资源链接到它,我的代码会不那么困惑。是否可以链接到运行时生成的 CSS 文件?不涉及服务器,这必须在客户端完成。

最佳答案

免责声明:随着问题的完善,我将更新此答案。

编辑

听起来您的一切都在本地进行。在这种情况下,不可能从浏览器中运行的脚本(如 JavaScript)写入您的文件系统(主要出于安全原因强制执行)。虽然您可以从本地计算机链接和加载 CSS 文件,但您不能写入它们。

旧答案

您有几个选择,但我最感兴趣的是您的工作环境。假设以粗体显示。

存储在服务器上的 JSON 颜色文件:您应该在服务器端生成此样式表,并将其提供给您的客户端。这涉及创建路由 (URL) 以访问动态生成的样式表、输出格式化的 CSS(不太难)以及使用正确的 MIME 类型设置 header 。你如何做最后一部分取决于你的服务器实现(Node.js vs. PHP vs. 等等)

只能在客户端(无服务器)生成样式表:在这种情况下,假设您无权访问服务器,但您可以获取您的 JSON 颜色文件(从某个地方,我猜),你真的没有样式表资源链接到。这确实限制了缓存等方面的优化潜力。

您唯一真正的选择是在浏览器中创建和填充样式表。这里有一篇关于如何做到这一点的不错的文章:Add Rules to Stylesheets with JavaScript

关于javascript - 链接到程序生成的 CSS,就好像它是一个外部文件一样?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24903671/

相关文章:

javascript - 将 Angularjs 服务注入(inject) Controller

javascript - Chuck Norris 推特小部件在 IE 上失去了风格

javascript - 你如何在 jQuery/Javascript 中编写 CSS?

html - 在没有内容的 Div 上添加链接

javascript - 如何让 &lt;textarea&gt; 识别按下 Enter 按钮是一个\n 字符?

JavaScript onClick 事件 - HTML 表格

javascript - 如何使用 ui-router 显示错误页面,从先前状态导航时更改 url?

javascript - Phonegap 应用程序 - 防止 iphone 将数字变成拨号器链接

javascript - 带有图像动画的按钮悬停

css - 如何使 Divs 在水平导航和页脚之间使用 100% 高度