轻松上手,快乐学习!
HTML CSS JAVASCRIPT SQL PYTHON MYSQL PHP GIT 问答 工具 导航 更多 实例 参考

HTML DOM getBoundingClientRect() 方法

实例

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

var rect = obj.getBoundingClientRect();
亲自试一试 »

定义和用法

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

这个方法返回一个 DOMRect 对象，它有八个属性：left, top, right, bottom, x, y, width, height。

注释: 计算边界矩形时，会考虑视口区域的滚动量。这意味着每次滚动位置改变时，矩形的边（顶部、左侧、底部和右侧）都会改变它们的值。

浏览器支持

表中的数字指定了完全支持该方法的第一个浏览器版本。

方法
getBoundingClientRect() 1.0 9.0 3.0 4.0 9.5

语法

element.getBoundingClientRect()

技术细节

DOM 版本: CSS 对象模型（CSSOM）视图模块
返回值: 具有八个属性的 DOMRect 对象: left, top, right, bottom, x, y, width, height