在运行时使用jQuery创建CSS规则/类

Question

在运行时使用jQuery创建CSS规则/类通常我有一个CSS文件，它有以下规则：#my-window {     position: fixed;     z-index: 102;     display:none;     top:50%;     left:50%;}如何通过在运行时操作期间将CSS信息添加到正文或类似的东西来避免创建这样的静态CSS文件？（仅使用jQuery）我想用jQuery定义一次，然后多次使用它; 这就是为什么我不想每次都将它添加到特定的DOM元素。我知道简单的功能（css("attr1", "value");），但是如何创建完整的可重用CSS规则？

Answer 1

只是

$("<style>")
    .prop("type", "text/css")
    .html("\
    #my-window {\
        position: fixed;\
        z-index: 102;\
        display:none;\
        top:50%;\
        left:50%;\
    }")
    .appendTo("head");

注意到背斜线？它们用于连接新行上的字符串。离开它们会产生错误。

Answer 2

你可以将css应用于一个对象。所以你可以在你的javascript中定义你的对象，如下所示：

var my_css_class = { backgroundColor : 'blue', color : '#fff' };

然后只需将其应用于您想要的所有元素

$("#myelement").css(my_css_class);

所以它是可重用的。你会这样做的目的是什么？