元素偏移量offset
文章目录
- 1. offset概述
- 2. offset与style的区别
1. offset概述
offset就是偏移量,我们使用offset系列相关属性可以动态的得到该属性的位置(偏移)、大小等。
-
element.offsetParent
返回作为该元素带有定位的父级元素,如果父级都没有定位则返回body。需要注意的是,parentNode返回的是最近一级的父亲,不管父亲有没有定位。而offsetParent返回的是带有定位的父亲。 -
element.offsetTop
返回元素相对带有定位父元素上方的偏移 -
element.offsetLeft
返回元素相对带有定位父元素左边框的偏移 -
element.offstWidth
返回自身包括padding,边框,内容区的宽度,返回数值不带单位 -
element.offsetHeight
返回自身包括padding,边框,内容区的高度,返回数值不带单位
2. offset与style的区别
offset
1.可以得到任意样式表中的样式值
2.offse系列获得的数值是没有单位的
3.offsetWidth包含padding+border+width
4.offsetWidth等属性是只读属性,只能获取不能赋值
5.更适合来获取元素大小位置
style
1.只能得到行内样式表中的样式值
2.style.width获得的是带有单位的字符串
3.style.width获得不包含padding和border的值
4.style.width是可读写属性,可以获取也可以赋值
5.style更适合给元素更改值