创建动态内联样式表

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

我尝试这样做：

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

这在FF但在IE7弹出一个错误“意外的调用方法或属性的访问。”

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

给出相同的错误。如果我使用innerHTML或innerText，则无关紧要。奇怪的是它在追加样式标签之前显示错误。

我怀疑cssText与它有关，但我不知道如何。

来源

2010-01-11 David

我相信，CSS数据从文本/ HTML区别对待，所以你不能可靠地使用jQuery的文字编辑方法。 – 2010-01-11 11:38:38

将文本添加到将正确呈现的样式表中需要与其他浏览器不同的语法。您可以使用一些这与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); 
    }

来源

2010-01-11 13:30:13 kennebec

工程很好。 jQuery应该抽象这个！你知道的任何性能问题？ – David 2010-01-11 13:46:20

我经常在cookie中使用它来保持onload的用户显示偏好，有时在页面上进行大的样式更改，而不是循环遍历元素并应用各个样式。即使样式表规则方法得不到很好的支持，它在IE，firefox，opera和safari中也运行良好。 – kennebec 2010-01-11 14:17:51

David在一个抽象的jQuery插件中查看我的帖子，并在IE中使用这种方法。 – 2010-01-11 14:32:40

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

（声明：我从来没有真正使用这个自己）

来源

2010-01-11 11:43:43

生成CSS规则动态地将有缺陷的，即使它的工作的这种方法。在插入多于30个元素后，IE将忽略<style>元素（请参阅http://support.microsoft.com/kb/262161）。

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

来源

2010-01-11 11:47:21

创建动态内联样式表

回答

相关问题