js中offsetHeight，offsetWidth，offsetTop,offsetLeft属性的使用

作者简介：一名大四的学生，致力学习前端开发技术
⭐️个人主页：夜宵饽饽的主页
❔ 系列专栏：JavaScript小贴士
学习格言：成功不是终点，失败也并非末日，最重要的是继续前进的勇气

​​前言：

这里是关于js操作页面元素的使用的笔记,希望可以帮助到大家，欢迎大家的补充和纠正

页面偏移

属性	说明
element.offsetParent	返回元素的偏移容器
element.offsetHeight	返回元素的高度，包括边框和填充，但不是边距
element.offsetWidth	返回元素的宽度，包括边框和填充，但不是边距
element.offsetLeft	返回当前元素的相对水平偏移位置的偏移容器
element.offsetTop	返回当前元素的相对垂直偏移位置的偏移容器

1.element.offsetParent
element.offsetParent属性与定位有着很大的关系，它的定义是：与当前元素最近的经过定位的父级元素。主要有以下几种情况：

• 元素自身有fixed定位，那么offsetParent结果就是null
• 元素本身没有fixed定位，父级元素经过定位，那么offsetParent的结果为离自身元素最近的的经过定位的父级元素。
• 元素本身没有fixed定位，且父元素未经过定位，那么offsetParent的结果为
• 元素的offsetParent结果为是null

2.element.offsetHeight && element.offsetWidth
element.offsetHeight属性返回元素的垂直高度，element.offsetWidth属性返回元素的水平宽度。这两个属性包含了padding，border和滚动条。也就是说，如果不发生溢出，element.offsetHeight只比element.clientHeight多了边框的高度。

需要注意： 如果存在垂直滚动条，offsetWidth包括垂直滚动条的宽度；如果存在水平滚动条，offsetHeight包括水平滚动条的高度
3.element.offsetLeft && element.offsetTop
offsetTop表示元素的上外边框至offsetParent元素的上内边框之间的像素距离
offsetLeft表示元素的左外边框至offsetParent元素的左内边框之间的像素距离

下篇是关于滚动scrollTop等属性使用