js获取高度和宽度

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

实现方式:

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

第一种情况:

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

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

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

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

第二种情况:

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

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

两者的区别:

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

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

写在最后

  哪位大佬如若发现文章存在纰漏之处或需要补充更多内容,欢迎留言!!!

 相关推荐:

posted @ 2017-07-24 10:33  Marydon  阅读(637)  评论(0编辑  收藏  举报