阅读数:6 评论数:0

一、DOM元素的宽度和高度

1、offsetWidth、offsetHeight

offsetWidth 和 offsetHeight 返回元素的总宽度和高度，包括内容区、内边距（padding）、边框（border），以及滚动条的宽度。

2、clientHeight,clientWidth

不包括边框、滚动条和外边距

3、scrollWidth,scrollHeight

完整宽度和高度，包括被滚动视口遮挡的部分。

4、getBoundingClientRect()

getBoundingClientRect() 返回一个 DOMRect 对象，描述元素的宽度、高度及相对于视口的位置。

二、DOM元素的其它长度属性

1、offsetLeft,offsetTop

offsetLeft 和 offsetTop 用于获取元素相对于其最近的已定位父元素的水平和垂直偏移量。

2、scrollLeft,scrollTop

元素的水平和垂直滚动位置

3、clientLeft, clientTop

元素内容区与其边框内边缘之间的水平和垂直距离。通常，这些值表示元素的边框宽度。

4、pageXOffset, pageYOffset

返回文档在当前视口中的水平和垂直滚动距离。这些属性通常与 window.scrollX 和 window.scrollY 互换使用。

5、scrollWidth, scrollHeight

除了可以用在具体的元素上获取内容的总宽高，还可以用在 document 上，获取整个文档的滚动宽度和高度。