1. <!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            #Div2{width:100px;height:100px; background:black;}
        </style>
        
        <script type="text/javascript">
          window.onload=function(){
              //获取行间样式
            var oDiv=document.getElementById("Div");
            alert(oDiv.style.background);
            
        
            //获取非行间样式 ，不可行方案
            var oDiv2=document.getElementById("Div2");
//            alert(oDiv2.style.background);/用此种方法;是无法获取非行间样式的;*
            
            
        //获取非行间样式 方法，currentStyle是IE中的属性，getComputedStyle是其他浏览器的方法（注意其有两个参数）；在非行间样式中，style属性只能去赋值，在行间样式中才能去获取样式；
        function getStyle(obj, attr)  
        {  
            if(obj.currentStyle)  
            {  
                return obj.currentStyle[attr];  
            }  
            else  
            {  
                return  window.getComputedStyle(obj,false)[attr];  
            }  
        }  
        alert(getStyle(oDiv2,"background")) ;  
      }
          

        </script>
    </head>
    <body>
    <div id="Div" style="width:100px ;height: 100px; background: red;"></div>
    <div id="Div2"></div>
    </body>
</html>

     

 

getStyle 函数有 2 个参数，第一个参数 obj 为要获取的对象，第二个参数 name 为要获取的属性，并且做了兼容处理，currentStyle 针对 IE 浏览器，getComputedStyle 针对火狐浏览器。