封装 function getStyle(obj , attr){ return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr]; //兼容写法IE:火狐 };
效果如下:
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus?"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <title>Document</title> <style> *{ margin: 0; padding: 0; } #box{ margin: 50px auto; width: 300px; height: 250px; color: #fff; background:#70aa39; text-align: center; line-height: 50px; } </style> </head> <body> <div id="box"></div> <script> var oBox = document.getElementById("box"), oW = parseFloat(getStyle(oBox , "width")), oH = parseFloat(getStyle(oBox , "height")); oBox.innerHTML = "宽:"+oW+"px"+"<br/>"+"高:"+oH+"px"; //封装 function getStyle(obj , attr){ return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr]; //兼容写法IE:火狐 }; </script> </body> </html>
时间: 2024-10-08 06:36:44