js 元素偏移量 offset 元素可视区client

offset

可以动态的获取获取元素的位置（偏移）、大小等。

1. 获取元素距离带有定位父元素的位置
2. 获取元素自身的大小（宽高）
3. 返回的值不带单位

ele.offsetParent 返回该元素带有定位的父级元素，没有就返回body
ele.offsetTop 返回该元素带有定位的父级元素上方的偏移
ele.offsetLeft 返回该元素带有定位的父级元素左边的偏移
ele.offsetWidth 返回该元素 包括padding、border、内容区的宽度 不带单位
ele.offsetHeight 返回该元素 包括padding、border、内容区的高度 不带单位

offset和style的区别

client

client属性可以用来获取元素可视区的相关信息

ele.clientTop 返回元素上边框的大小
ele.clientLeft 返回元素左边框的大小
ele.clientWidth 返回 元素 padding+内容区的宽度 不含边框  不带单位
ele.clientHeight 返回 元素 padding+内容区的高度 不含边框  不带单位