js的各种获取大小

相信大家也经常会被js的获取大小搞得头昏脑胀，到底应该用哪种方式获取才是我要的那种大小呢

好啦，在此我帮大家整理好我知道的那些。

window.screen.availHeight

获取的是当前电脑的屏幕大小

注意：这个大小是屏幕大小，不是浏览器窗口的大小

window.innerHeight

获取的是当前浏览器的可用视口的大小

想要整张页面刚好和占满的话就用这个吧

注意：当谷歌浏览器全屏会有1px的误差(比实际全屏略大)；火狐不存在

document.body.clientHeight :

获取的是当前body的高度

感觉和body的offsetHeight一样大

document.body.offsetHeight :

当前的网页所占的撑起的body的大小，如果设置浮动可能这个值为0哦。

document.getElementById("box").style.height

css中的height，废话就不多说了

window.getComputedStyle(document.getElementById("box"))["height"]

当前计算后实际的高度，这个用在万一css的height为百分比或者rem,em该怎么办呢

document.element.offsetTop 和 window.pageYOffset

获取元素的高度和窗口的当前位置这个是相对于整个浏览器的，一般可以用来做滚动效果