JS 样式获取 window.getComputedStyle

使用getComputedStyle获取元素样式的时候,一定要将样式的名称写完整

#test {
    border:solid 1px #ddd;
}
<div style="width:200px;height:200px;background:orange" id="test"></div>
<script type="text/javascript">
    //获取元素
    var test = document.getElementById('test');

    //获取元素的宽度
    var width = test.style.width;
    var border = test.style.border;

    //获得元素计算之后的样式
    var res = window.getComputedStyle(test);//get 获取  computed 计算后的  style样式
    console.log(res);

    var border = res.borderBottomWidth;

    alert(border);
</script>