获取非行间样式

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <style>
            #box{
                width: 300px;
                height: 200px;
                background: red;
            }

        </style>
    </head>
    <body>
        <div id="box"></div>
        
    </body>
</html>
<script type="text/javascript">
    var tt=document.getElementById("box");
//封装函数直接调用
    function getStyle(obj,attr){
        if(obj.currentStyle){
            return obj.currentStyle[attr];
        }else{
            return getComputedStyle(obj)[attr]; 
        }
    }
    var gg = getStyle(tt,"width");
    console.log(gg)

三目表达式:

var oStyle = tt.currentStyle? tt.currentStyle : window.getComputedStyle(tt, null);

console.log(oStyle.width)




如果不考虑IE：直接获取辣鸡IE
console.log(getComputedStyle(tt)["width"])


</script>

获取非行间样式

推荐阅读