js获取高度和宽度

CreateTime--2017年7月24日10:15:47
Author:Marydon

js获取高度和宽度

参考连接:http://www.cnblogs.com/EasonJim/p/6229517.html

实现方式:

    style.height----offsetHeight,style.width----offsetWidth

第一种情况:

  宽高都写在样式表里,就比如 #div1{120px;height:100px;}。

  获取id=‘div1’的宽和高,如何实现?

  通过document.getElementById('div1').style.height/width,返回值为空,即获取不到宽和高;

  必须通过document.getElementById('div1').offsetHeight/offsetWidth  

第二种情况:

  宽和高写在行内,如style="120px;height:100px;" 

  上述2个方法都能获取到宽度和高度

两者的区别:

  a.通过style.attr的方式取值有限制条件:即要获取的属性必须在行内样式中声明;而id.offsetWidth和id.offsetHeight无视样式写在样式表还是行内,都能获取到元素的宽和高;

  b.offsetWidth/offsetHeight=容器宽度+两侧边框宽度,返回值是数值;而style.attr返回的就是div的宽度,返回值是数值+"px"。

原文地址:https://www.cnblogs.com/Marydon20170307/p/7227645.html