DOM中元素的offsetHeight和scrollHeight有什么区别？

Question

在DOM中，元素的offsetHeight和它的scrollHeight之间有什么区别？ 解释中的图像将是一个很大的帮助。

Answer 1

HTMLElement.offsetHeight是一个度量，它包括元素边框，元素垂直填充，元素水平滚动条（如果存在，如果呈现）和元素CSS高度。 HTMLElement.scrollHeight是元素内容高度的度量，包括由于溢出而在屏幕上不可见的内容。 HTMLElement.scrollHeight返回的值将包括padding-top和padding-bottom，但不包括元素边框或元素水平滚动条。

这个页面和这个页面是我的来源。

MDN文档还提供了要演示的图像。

Answer 2

正如@Csarsam所说，偏移高度是边框高度（我正在重写）。 滚动高度是可滚动内容的高度，通常由多个元素组成。 但滚动高度它也定义在不滚动的元素上，因此没有可滚动的内容，在这种情况下（我已经检查但我没有提及备份）滚动高度是它的内容高度，也就是说，它不包括边距和边框。 但是当元素是可滚动内容的一部分时，会考虑其边距来计算其父元素的滚动高度。

滚动高度是在可滚动内容和不可滚动内容上定义的，这可能会造成混淆。

更新

这是一个参考，它确认我检查了什么： https ： //developer.mozilla.org/en-US/docs/Web/API/Element/scrollHeight