创建动态内联样式表

使用js和/或jQuery创建动态样式标签的最佳方法是什么？

我试过这个：

var style= jQuery('').text('.test{}'); 

这适用于FF，但在IE7“意外调用方法或属性访问”中弹出错误。

 var style = document.createElement('style'); style.innerHTML='.test{}'; 

给出了同样的错误。 如果我使用innerHTML或innerText并不重要。 奇怪的是它在附加样式标记之前显示错误。

我怀疑cssText与它有关，但我不确定如何。

Answer 1

将文本添加到将正确呈现的样式表中需要在IE中使用与其他浏览器不同的语法。 您可以使用jquery来使用其中一些

  document.addStyle= function(str, hoo, med){ var el= document.createElement('style'); el.type= "text/css"; el.media= med || 'screen'; if(hoo) el.title= hoo; if(el.styleSheet) el.styleSheet.cssText= str;//IE only else el.appendChild(document.createTextNode(str)); return document.getElementsByTagName('head')[0].appendChild(el); } 

Answer 2

这种动态生成css规则的方法即使有效也会有缺陷。 插入超过30个后，IE将忽略

元素（请参阅http://support.microsoft.com/kb/262161 ）。

您可以使用jquery.rule插件来通过javascript操作css规则。

Answer 3

我会研究Javascript的document.styleSheets和addRule()方法。

（免责声明：我自己从未实际使用过这个）