document.body.clientHeight与document.documentElement.clientHeight
1 document.body.clientHeight是指页面body元素的的高度,但是如果你的body是这样的:
<body> <div class="bg"> <img src="./img/123.jpg"> </div> <div class="btn"> <img src="./img/pointer-normal.png"> </div> <div> <label>touchstart:</label> <span class="start"></span> </div> <div> <label>touchend:</label> <span class="end"></span> </div> <div> <label>click:</label> <span class="click"></span> </div> </body>
那么你打印出来的高度document.body.clientHeight的数值可能和你相像的有一点区别(偏小),主要区别就在于body顶部的img元素,因为img的图片加载需要时间,打印的时候图片并没加载完成,所以偏小的那一部分刚好是图片的高度。(div.btn设置了高度,然而div.bg没有设置高度)
2 document.documentElement.clientHeight是页面可见区域的高度(屏幕可见html文档的高度),而不是html元素的高度。document.documentElement.offsetHeight(整个html文档的高度)等与document.body.clientHeight的数值。