HTML DOM getBoundingClientRect() 方法

HTML DOM Element 对象

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

返回的值是具有八个属性的DOMRect对象：left, top, right, bottom, x, y, width, height。

注意：在计算边界矩形时，要考虑viewport区域的滚动量。这意味着每当滚动位置发生变化时，矩形的边缘(顶部、左侧、底部和右侧)都将更改它们的值。

语法：

element.getBoundingClientRect()

var div = document.getElementById("myDiv");
var rect = div.getBoundingClientRect();

浏览器兼容性

所有浏览器完全支持getBoundingClientRect()方法：

方法
getBoundingClientRect()	是	是	是	是	是

技术细节

HTML DOM Element 对象