HTML DOM 元素 getBoundingClientRect()

返回元素的大小及其相对于视口的位置：

const rect = element.getBoundingClientRect();

描述

这个getBoundingClientRect()方法返回元素的大小及其相对于视口的位置。

这个getBoundingClientRect()方法返回一个具有八个属性的 DOMRect 对象：left、top、right、bottom、x、y、width、height。

已完成的滚动将被考虑在内。这意味着每次滚动位置改变时，矩形的边缘（上、左、下、右）的值都会改变。

element.getBoundingClientRect()

类型	描述
对象	具有八个属性的 DOMRect 对象：左、上、右、下、x、y、宽度、高度。

element.getBoundingClientRect()所有浏览器都支持：


Chrome	Edge	Firefox	Safari	Opera	IE
Yes	Yes	Yes	Yes	Yes	9-11