offset系列的5个常用的属性

1.可以得到元素的偏移位置返回的不带单位的数值
console . log(father .offsetTop);
console . log(father . offsetLeft);
//它以带有定位的父亲为准 如果么有父亲或者父亲没有定位则以body 为准

2.可以得到元素的大小宽度和高度是包含padding + border + width
var w = document . querySelector(' .w' );
console . log(w. offsetWidth);
console . log (w . offsetHeight);

3.返回带有定位的父亲否则返回的是body
console.1og(son . offsetParent); //返回带有定位的父亲否则返回的是body
console. log(son. parentNode); //返回父亲是最近一级的父亲亲爸爸不管父亲有没有定位

4.offset与style区别
offset

• offset 可以得到任意样式表中的样式值
• offset 系列获得的数值是没有单位的
• offsetWidth 包含padding+ border +width
• offsetWidth 等属性是只读属性,只能获取不能赋值
  

所以， 我们想要获取元素大小位置,用offset更合适

style

• style只能得到行内样式表中的样式值
• style.width获得的是带有单位的字符串
• style.width 获得不包含padding和border的值
• style.width 是可读写属性,可以获取也可以赋值
  

所以,我们想要给元素更改值,则需要用style改变