Javascript 动态生成的css

我正在考虑用JavaScript动态生成的样式标记替换一些静态css文件。我的目的不是为整个文档构建样式表，而是将其用于添加到页面中的插件，如选项卡、幻灯片等。我目前处理的样式表有10到20行

我看到了几个好处：

• 仅加载js文件，而不是同时加载js和css
• 动态定义主题的能力（例如，输入颜色作为变量）
• 能够动态定义选择器（例如，命名空间的类名）
• 添加特定于浏览器的样式

这种方法的缺点是什么？你能推荐一些关于这个话题的好参考资料吗

我做了一些研究，发现了以下工具：

• -但仍需要加载单独的样式表
• （显然是一个新图书馆）

---

在我看来，将JavaScript用于CSS听起来有点混乱。当你提到你自己时，我建议你使用或类似的方法。是的，这将导致加载一个额外的资源，但我认为与使用JavaScript进行样式化相比，这是非常值得的。在我看来，这是一个错误的工具。
Less绝对是棒极了，我认为你不应该尝试用javascript中的自定义库生成css。最好将javascript尽可能与css分开
我们使用某些element class=“”属性来触发javascript逻辑，但它们从不与我们较少的样式中使用的类重叠。（我们对两者使用不同的大小写规则，以防止发生重叠）
动态加载css的一部分也没有多大好处。我们在开发过程中运行的是less.js javascript，但我们在生产环境中运行“lessc”编译器，所以我们总是有一个样式表（还使用YUI压缩程序压缩它）
除非总的css是绝对庞大的，我们更喜欢在第一次点击时加载一个大的css文件，然后缓存文件
确保在任何时候都加载所有css（而不仅仅是部分css），这也有助于确保没有冲突规则。如果您必须进行重构，并将应用程序的某些部分移动到其他URL（在这些URL中突然出现重叠），那么这将真正有利于您
所以我建议，与其试图通过动态生成所需的样式来解决您的问题，您可能只需要更好地组织您的css

---

如果您正在寻找一个有效使用less的好例子，请查看
另一个好处是，页面中加载的每个附加资源都会降低整个页面的加载速度，因为浏览器在给定时间通常只同时加载4个资源
然而，在页面加载时进行所有这些组合很可能会导致页面速度降低，这与单独处理的速度一样慢。。。这取决于它需要迭代多少内容才能组成最终的css块
就性能而言，在我看来，javascript不太可能优雅/高效地取代组合css文件中包含的样式
另一件事是，在生产环境中，您还可以做另一种选择，即使用库预先生成一组缩小、优化（在JS中是模糊的）代码，然后在加载页面时加载1个JS文件和1个css文件，这反过来又可以缓存以获得速度/加载优势。我认为样板库有一个脚本

---

一天结束：能量既不会被创造也不会被破坏——如果你不小心，你的优化会在一个地方伤害到你，在其他地方伤害到你。
Thx。在我的例子中——模块化应用程序——用户应该能够选择插件并定制他们的风格，所以我不能真正拥有一个大的css文件。