刚刚帮朋友写一个样式加载数据的时候，用到了这样的一个语句，document.documentElement.clientHeight，
<body><h1>x</h1> <div class="box"><ul><li><img src="1.jpg" alt="111111"></li><li><img src="2.jpg" alt="111111"></li><li><img src="3.jpg" alt="111111"></li><li><img src="4.jpg" alt="111111"></li><li><img src="5.jpg" alt="111111"></li><li><img src="6.jpg" alt="111111"></li><li><img src="7.jpg" alt="111111"></li><li><img src="8.jpg" alt="111111"></li><li><img src="9.jpg" alt="111111"></li><li><img src="10.jpg" alt="111111"></li><li><img src="11.jpg" alt="111111"></li><li><img src="12.jpg" alt="111111"></li><li><img src="13.jpg" alt="111111"></li><li><img src="14.jpg" alt="111111"></li><li><img src="15.jpg" alt="111111"></li><li><img src="1.jpg" alt="111111"></li><li><img src="2.jpg" alt="111111"></li><li><img src="3.jpg" alt="111111"></li><li><img src="4.jpg" alt="111111"></li><li><img src="5.jpg" alt="111111"></li><li><img src="6.jpg" alt="111111"></li><li><img src="7.jpg" alt="111111"></li><li><img src="8.jpg" alt="111111"></li><li><img src="9.jpg" alt="111111"></li><li><img src="10.jpg" alt="111111"></li><li><img src="11.jpg" alt="111111"></li><li><img src="12.jpg" alt="111111"></li><li><img src="13.jpg" alt="111111"></li><li><img src="14.jpg" alt="111111"></li><li><img src="15.jpg" alt="111111"></li></ul><div id="jz">点击加载更多</div> </div>结构就是上面。box没有设置样式高度。这个时候我要取可视区的高度就用:document.documentElement.clientHeight 可以了
但是因为我要给最下面的加载定位，必须要有高度，我就动态设置了box的高度。然后我就发现一个很不容易发现的问题，效果和我原来的算法不一样，浏览器并没有报错。
我一直在找原因，经过1个小时的BUG排查，，打印出console.log(document.documentElement.clientHeight),惊人的发现，这并不是可视区域的高度，是整个网页的高度。
网上查找一些资料，很多人说是因为DTD也就是W3C声明的原因。具体我也没在意。我换成了console.log(document.body.clientHeight) 这个时候可视区域的高度就出来了。
现在这个规律是，当你在body体里面设置了界定的高度，并且这个高度大于你可视区域的高度（也就是有滚动条了），这个时候你取可视区域的高度要用document.body.clientHeight
当body里面的内容也产生了滚动条，但是你没有在样式中设置，这个时候你去可视区域的高度用document.documentElement.clientHeight。
documentElement是文档的根节点。body只是个节点。
孤独是一种无奈的选择，孤独是因为没有找到合适的同行者，
