javascript原生style属性分析

 1 <!DOCTYPE html>
 2 <html>
 3 <head lang="en">
 4     <meta charset="UTF-8">
 5     <title></title>
 6 </head>
 7 <body>
 8 由于oDiv.style只能获取到行间样式,非行间样式需要用到currentStyle
 9 <div id="div1"></div>
10 <style>
11     #div1{
12         width: 100px;
13         height: 200px;/*单一样式或者简单样式*/
14         background-color: darkslategray;/*复合样式*/
15         border: 1px solid #DEDEDE;/*复合样式*/
16     }
17 </style>
18 <script>
19     window.onload=function(){
20        var oDiv1=document.getElementById("div1");
21     alert(getStyle(oDiv1, "background"));
22 
23     }
24 
25     function getStyle(obj, name){  //无法获取复合样式
26         if(obj.currentStyle){
27             return obj.currentStyle[name];//IE下可用
28         }else{
29             return getComputedStyle(obj, false)[name];//ff和google可用
30         }
31     }
32 </script>
33 </body>
34 </html>

 

posted @ 2016-03-29 17:17  雨落知音  阅读(416)  评论(0编辑  收藏  举报