我的平台在同一网页上提供了一些类似的小部件。这些小部件嵌入到 iframe 中，并在它们之间共享相同的 CSS 定义。
当前版本使用 <link rel="stylesheet"> 加载此定义标签。但是，我正在考虑将加载策略更改为 <style> 内的 css 内联定义标签。
- 在目标页面上加载基础 javascript
- 创建一个隐藏的 iframe，并加载 CSS
<link>在上面(异步 document.write 调用) - 将此 CSS 内容设置为目标页面上下文中的 javascript var。
第 1 步和第 2 步已经实现并有效。现在，步骤 3 应该如何实现？
经过一些新的测试后，我会在这里发布所有积极的结果。
最佳答案
您不想将 Javascript 用于可以用纯 CSS 完成(或至少轻松完成)的事情。有很多人没有启用 JS...我认为您不想限制他们对您网站的访问。您正在寻找的内容可以通过 CSS @import 规则来完成。这非常简单——您需要做的就是将 @import "path/to/css/file" 放在所有您的其他样式规则之上。该路径是相对于当前样式表的；如果它在 HTML 文件中，那么它是相对于 HTML 文件的。
例如，如果您有一个像 stackunderflow.com 这样的域，一个样式表位于顶级文件夹中，一个名为 style2.css 的样式表位于一个名为 extra-styles< 的文件夹中，然后您可以通过相对路径从 extra-styles 导入样式表:@import "extra-styles/style2.css" 另一个好处是几乎所有浏览器都支持它。
关于javascript - 将 <link rel ="stylesheet"> 原始内容加载到 <style> 标签中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23895701/