js 获取计算后的样式写法及注意事项

  currentStyle

  1.复合样式:currentStyle取不到

  例:background、margin

  2.取默认样式

  3.只能读

  

复制代码 代码如下:

  <html>

  <head>

  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

  <title>获取计算后的样式</title>

  <style type="text/css">

  #div1{ height:100px; background:#069;}

  </style>

  <script type="text/javascript">

  //兼容

  function getStyle(obj, name)

  {

  if(obj.currentStyle)

  {

  return obj.currentStyle[name];

  }

  else

  {

  return getComputedStyle(obj, false)[name];

  }

  }

  window.onload=function()

  {

  var oDiv=document.getElementById('div1');

  alert(getStyle(oDiv, 'width'));

  alert(getStyle(oDiv, 'backgroundColor')); //注意在获取复合样式时要单独写,不能写background

  };

  </script>

  </head>

  <body>

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

  </body>

  </html>