码迷,mamicode.com
首页 > 编程语言 > 详细

原生JavaScript获取css样式

时间:2017-05-06 10:18:37      阅读:98      评论:0      收藏:0      [点我收藏+]

标签:div   java   head   logs   body   position   blog   属性   空字符串   

 

访问属性:obj.attr 或者 obj[‘attr‘]

通过js访问style属性 :

document.getElementById("main").style.backgroundColor; 

 

 

 style 只能获取元素的内联样式。因此,要获取元素的完整的样式信息,必须使用 window 对象的 getComputedStyle 方法,此方法有2个参数,第一个参数为要获取计算样式的元素,第二个参数可以是null、空字符串、伪类(如:before,:after),这两个参数 都是必需的。

完整实例:

 

<!doctype html>
<html>
<head>
    <style>
      
        #mask {
            position: absolute;
            z-index: 1000;
            top: 10px; left: 0;
            background: blue;
            width: 100px;
            height: 100px;
        }
    </style>
</head>
<body>
 
<div id="mask" style="border: dashed"></div>
<script>
    var mask = document.getElementById(mask);
    var style = window.getComputedStyle(mask, "");
    console.log(34,style.position,mask.style.border);

</script>
</body>
</html>

 

原生JavaScript获取css样式

标签:div   java   head   logs   body   position   blog   属性   空字符串   

原文地址:http://www.cnblogs.com/web-fusheng/p/6815488.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!