clientHeight \ offsetHeight \ sc

clientHeight \ offsetHeight \ scrollHeight

1. clientHeight: 元素可视区域的高度，滚动条、border、margin不算在内，padding算在内
   clientHeight = topPadding + bottomPadding + height - 水平滚动条高度；

   
   clientHeight.png

2. offsetHeight:
   offsetHeight = height + padding + border + 水平滚动条
   offsetHeight不包括伪元素（pseudo-elements， :after, :before ）的高度

   
   offsetHeight.png

3. scrollHeight:
   如果要不使用scroll，完整显示该元素所需要的高度（包括padding和伪元素，不包括border和margin）
   如果元素可以不需要垂直滚动条就完全显示出来，则 scrollHeight = clientHeight

   
   scrollHeight.png