JS中的offset
一、offsetWidth与offsetHeight：
获取的是元素的实际宽高 = width + border + padding
注意点：
1.可以获取行内及内嵌的宽高
2.获取到的值是一个number类型，不带单位
3.获取的宽高包含border和padding
4.只能读取，不能设置
console.log ( div.offsetWidth );//width + border + padding
console.log (div.offsetHeight );//height + border + padding二：offsetLeft与offsetTop:
offsetLeft:获取自己左外边框与父级元素的左内边框的距离
offsetTop:获取自己上外边框与父级元素的上内边框的距离
offsetTop 和 style.top 的区别：
１．最大区别在于 offsetLeft 可以返回没有定位盒子的距离左侧的位置。 而 style.top 不可以 只有定位的盒子 才有 left top right
２．offsetTop 返回的是数字，而 style.top 返回的是字符串，除了数字外还带有单位：px。
３．offsetTop 只读，而 style.top 可读写。
４．如果没有给 html 元素指定过 top 样式，则 style.top 返回的是空字符串。
５．最重要的区别 style.left 只能得到 行内样式 offsetLeft 随便
三：offsetParent:获取最近的定位父元素 （自己定位参照的父元素）
注意点：
1.如果元素自身是固定定位（fixed），则定位父级是null
2.如果元素自身是非固定定位,并且所有的父元素都没有定位，那么他的定位父级是body
3.body的定位父级是null
offsetParent 和 parentNode的区别：
如果当前元素的父级元素没有进行css定位（position为absolute或relative），offsetParent为body。
如果当前元素的父级元素中有CSS定位（position为absolute或relative），offsetParent取最近的那个父级元素。
本文内容仅供个人学习、研究或参考使用，不构成任何形式的决策建议、专业指导或法律依据。未经授权，禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载，请保留原文来源信息，不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持！
