在学习图片懒加载几个版本的实现对比的时候，自己写个例子：代码 发现document.documentElement.clientHeight拿到的高度居然很高，不是视窗可视区域的高度，而是所有item之和的高度。
html节点的clientHeight跟scrollHeight居然都是1000,body的clientHeight为874，scrollHeight为10000 既然滚动条在body这层，那么html节点就不应该有那么高，应该是874左右才对。翻看了几个站点，比如掘金，发现滚动条都在html节点这层，html节点的clientHeight就是视窗的可视区域高度，远小于scrollHeight，看看其css设置发现并没有特殊之处。第二天才注意到头部的<!DOCTYPE html>加上后果然，滚动条就是在html节点，html节点的clientHeight就是视窗的高度。我用的是chrome，从结果反推回去chrome默认使用的并不是文档模式的标准模式。所以切记写HTML的时候头部加上文档类型的声明。引用mdn说的：范例中的DOCTYPE，<!DOCTYPE html>，是所有可用的 DOCTYPE 之中最简单的，也是 HTML5 所推荐的。
网友评论