Javascript中的多个样式属性

时间:2014-03-04 21:01:24

标签: javascript css

我必须为元素应用多种样式,目前我有

document.getElementById("element1").style.top="1px";
document.getElementById("element1").style.marginLeft="0px";
|
|
|
document.getElementById("element1").style.left="10px";

我怎样才能在单行中完成?像

document.getElementById("element1").style={"top":"1px","left":"0px"};

我想使用普通的Javascript而不是Jquery。有可能吗?

3 个答案:

答案 0 :(得分:2)

document.getElementById("element1").style.cssText = "top: 1px; left: 0px;";

这应该可以,但它会覆盖所有现有的内联定义样式。

希望这有帮助。

答案 1 :(得分:2)

为避免覆盖当前的课程,您可以执行以下操作

document.getElementById("element1").style.cssText += "top: 1px; left: 0px;";

答案 2 :(得分:-1)

  1. 使用JQuery库
  2. 使用css类
  3. 示例:

    <style>
    
    .someClass {
       top: 1px;
       left: 0px;
    }
    
    </style>
    
    <script>
    
    $(document).ready(function(){
    
      $("#mydiv").addClass("someClass");
    
      $("#mydiv").removeClass("someClass");
    
    });
    
    </script>
    
    <html>
    <body>
    <div id="mydiv"></div>
    </body>
    </html>
    
    祝你好运!