offset、client、scroll系列属性

1、offset系列

offsetParent:
获取距离当前元素最近的定位父元素，如果没有定位父元素此时获取的是body
位置
（1）offsetLeft:获取当前元素距离offsetParent的左偏移量
（2）offsetTop:获取当前元素距离offsetParent的上偏移量
大小
（1）offsetWidth:获取当前元素的宽度(包括边框和padding)
（2）offsetHeight:获取当前元素的高度(包括边框和padding)

2、client系列

image.png

大小
（1）clientLeft 获取的是border-left(左边框的宽度)
（2）clientTop 获取的是border-top(上边框的宽度)
（3）clientWidth 获取的宽度包括padding，但是不包括border（如果有滚动条则不包括滚动条）
（4）clientHeight 获取的高度度包括padding，但是不包括border（如果有滚动条则不包括滚动条）

3、scroll系列

image.png 图片中是当出现滚动条的时候

1、滚动出去的距离
（1） scrollLeft:向左滚动出去的距离
（2）scrollTop:想上滚动出去的距离
2、大小
（1）scrollWidth:等于元素的宽(如果内容的宽大于元素的宽，则计算的是内容的宽)，包括padding（不包括边框，如果有滚动条则不包括滚动条）
（2）scrollHeight:等于元素的高(如果内容的高大于元素的高，则计算的是内容的高)，包括padding（不包括边框，如果有滚动条则不包括滚动条）