offset翻译过来就是偏移量，我们使用offset系列相关属性可以动态的得到该元素的位置（偏移)、大小等。
●获得元素距离带有定位父元素的位置
●获得元素自身的大小(宽度高度)
●注意:返回的数值都不带单位
<style>
.father {
width: 500px;
height: 500px;
background-color: aqua;
position: absolute;
left: 220px;
top: 220px;
}
.son {
width: 150px;
height: 150px;
background-color: blueviolet;
position: absolute;
left: 200px;
top: 150px;
}
</style>
</head>
<body>
<div class="father">
<div class="son"></div>
</div>
</body>
<script>
// offset 系列
var father = document.querySelector(".father");
var son = document.querySelector(".son");
// 可以得到元素的偏移 位置 返回的不带单位的数值
console.log(father.offsetTop);
console.log(father.offsetLeft);
console.log(son.offsetLeft);
// 可以获得元素的宽高
console.log(son.offsetWidth);
console.log(son.offsetHeight);
// 返回带有定位的父亲 否则返回的是body
console.log(son.offsetParent);
console.log(son.offsetNode); //返回父亲最近一级的父亲 亲爸爸 不管父亲有没有定位
</script> ![object-fit和object-position_定义图片和视频元素在容器内如何显示的css属性[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)