在飞行中用jquery添加div，class和style？

Question

这是我的代码（jquery）

var my_css_class = "{  position: absolute; top: 1400px;left: 40%;background-color: Menu;border: #f9f9f9;height: 200px;width: 300px; }";
this.popOut = function(msgtxt) {

      //filter:alpha(opacity=25);-moz-opacity:.25;opacity:.25;
        this.overdiv = document.createElement("div");
        this.overdiv.className = "overdiv";
        /* I want to add style into class square?*/
        this.square = document.createElement("div");
        this.square.className = "square";        
         $('.square').css(my_css_class);/*<----*/
        this.square.Code = this;

        var msg = document.createElement("div");
        msg.className = "msg";
        msg.innerHTML = msgtxt;
        this.square.appendChild(msg);
        var closebtn = document.createElement("button");
        closebtn.onclick = function() {
            this.parentNode.Code.popIn();
        }
        closebtn.innerHTML = "Close";
        this.square.appendChild(closebtn);

        document.body.appendChild(this.overdiv);
        document.body.appendChild(this.square);
    }

我想将样式添加到班级广场？

             div.square { 
                 position: absolute;
                 top: 1400px;
                 left: 40%;
                 background-color: Menu;
                 border: #f9f9f9;
                 height: 200px;
                 width: 300px; 
                }

我该怎么做？

由于

Answer 1

您可以将css应用于对象。所以你可以在你的javascript中定义你的对象：

var my_css_class = {  "position": "absolute",
                      "top": "1400px",
                      "left": "40%",
                  };

然后你可以像

一样使用它

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

它也可以重复使用。希望这个帮助

在您的示例中

$('.square').css(my_css_class);

Answer 2

您可以将此格式用于单个css属性...

$('div.square').css('propertie','value'); // this is for only CSS propertie..

如果要一次添加多个CSS属性。你必须在css（{}）中传递一个对象作为参数 喜欢这个

$('div.square').css({
    position: absolute;
    top: 1400px;
    left: 40%;
    background-color: Menu;
    border: #f9f9f9;
    height: 200px;
    width: 300px; 
});

Answer 3

在变量

中声明您的样式

var my_css_class = {  "position": "absolute",
                          "top": "1400px",
                          "left": "40%",
                      };

- ＆GT;在您的函数内部将这些样式分配给您的类

$('.square').css(my_css_class); 

Answer 4

$('.square').css({'width':'300px','background-color': Menu, ... });

Answer 5

您可以使用以下格式使用jQuery向类添加样式：

$('selector').css(propName, propValue)

示例：

$('div.square').css('position','absolute');

对所有属性重复此操作。 也可以一次添加多个道具。有关更多信息，请参阅以下文档。

http://api.jquery.com/css/#css-propertyName-function