先上一张神图：
以height为例：
offsetHeight
1 | is a measurement which includes the element borders, the element vertical padding, the element horizontal scrollbar (if present, if rendered) and the element CSS height. |
offsetHeight = 可看到的元素高度 + 纵向padding + 边框高度 + 横向滚动条高度
clientHeight
1 | returns the inner height of an element in pixels, including padding but not the horizontal scrollbar height, border, or margin |
clientHeight = 可看到的元素高度 + 纵向padding - 横向滚动条高度
scrollHeight
1 | is a measurement of the height of an element's content including content not visible on the screen due to overflow |
scrollHeight = 可看到的元素高度 + 看不到的元素高度 + 纵向padding
参考文章来源：
The properties of offsetTop, clientTop, scrollTop in the JS
What is offsetHeight, clientHeight, scrollHeight?