关于offset、client以及sroll系列
offset系列
| offset | |
|---|---|
| ele.offsetParent | 返回作为该元素带有定位的父级元素。(父级无定位，返回body） |
| ele.offsetTop | 返回元素相对带有定位父元素上方的偏移 |
| ele.offsetLeft | 返回元素相对带有定位父元素左边框的偏移 |
| ele.offsetWidth | 返回自身padding+边框+盒子本身宽度。 |
| ele.offsetHeight | 返回自身padding+边框+盒子本身高度。 |
注意：
- offset获得的是只读属性，只能获取不能赋值
- 获得的值没有单位
- 如果内容超出盒子，则返回的还是盒子本身宽度
client系列
| client | |
|---|---|
| ele.clientTop | 返回元素上边框大小 |
| ele.clientLeft | 返回元素左边框大小 |
| ele.clientWidth | 返回自身padding+宽度。 |
| ele.clientHeight | 返回自身padding+高度。 |
注意：
- 获得的值没有单位
- 如果内容超出盒子，则返回的还是盒子本身宽度
scroll系列
| scroll | |
|---|---|
| ele.scrollTop | 返回被卷去的上侧距离 |
| ele.scrollLeft | 返回被卷去的左侧距离 |
| ele.scrollWidth | 返回自身实际宽度。 |
| ele.scrollHeight | 返回自身实际高度。 |
注意：
- 获得的值没有单位
- 如果内容超出盒子，则返回的是超出后整体的宽或高
小结：
- ele.offsetWidth= padding+border+盒子本身宽度
- ele.clientWidth= padding+盒子本身宽度
- ele.scrollWidth= 自身实际宽度
