前端如何高效使用getBoundingClientRect API？

本文共计743个文字，预计阅读时间需要3分钟。

前情+在前端开发需求中，经常需要获取元素的尺寸和位置属性。以往的做法是调用不同的API获取相关属性。+getBoundingClientRect()介绍+getBoundingClientRect()方法返回元素的大小及其相对于视口的位置。

前情

在前端开发需求中，经常需要获取元素的尺寸位置相关的属性，以往的做法是调用不同api获取相关属性的。

getBoundingClientRect介绍

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

标准盒子模型：元素的尺寸等于width/height + padding + border-width的总和。如果box-sizing: border-box，则元素的的尺寸等于 width/height。