用js获取、修改CSS：

1.获取

　　　　浏览器兼容问题，这段代码是判断浏览器的。获取obj元素的CSS,返回。

function getStyle(obj, attr){
            // currentStyleke判断浏览器是IE，那么返回width的值
            if (obj.currentStyle){
                // 仅限IE兼容
                return obj.currentStyle[attr];
            }else{
                // 兼容FireFox
                return getComputedStyle(obj, false)[attr];
            }
        }

　　　　我之前一直纠结这个函数到底返回的什么东西？试验一下。

<style>
    #div1{
        width: 200px;
        background-color: #1E0FFF;
        height: 200px;
            } 
</style>


<div id="div1" >
            
</div>

<script>

　　window.onload=function ()

　　　　{
　　　　　　var Div=document.getElementById('div1');
　　　　// 获取css
　　　　　　console.log(getStyle(Div, 'background-color'));
　　　　　　console.log(getStyle(Div, 'width'));

　　　　}

</script>

　　　　结果：

 

 

2.修改

　　　　（1）.一个个属性单独改:　　得写成 +'px'

　　　　　　　　

var oDiv=document.getElementById('div1');    
oDiv.style.width = 20 +'px';
oDiv.style.backgroundColor = '#333333'

　　　　 (2). 几个属性一起改：

 var attr = {width:700, height:700}
     for(var sty in attr){
             oDiv.style[sty] = attr[sty]+'px';
     }
console.log(getStyle(oDiv, 'width'));    //700px