getBoundingClientRect()

最新推荐文章于 2025-11-08 18:06:06 发布

原创最新推荐文章于 2025-11-08 18:06:06 发布 · 763 阅读

CC 4.0 BY-SA版权

本文介绍了JavaScript中获取元素位置的方法：getBoundingClientRect与getClientRects。详细解释了这两种方法的区别及应用场景，帮助开发者更好地理解和使用这些API。

console.log(this.getBoundingClientRect())
console.log(this.getClientRects()['0'])
//ClientRect {top: 356, right: 37.625, bottom: 377, left: 8, width: 29.625…}
//ClientRect {top: 356, right: 37.625, bottom: 377, left: 8, width: 29.625…}

getClientRects() 返回一个TextRectangle集合，就是TextRectangleList对象。TextRectangle对象包含了, top left bottom right width height 六个属性
getBoundingClientRect 返回一个TextRectangle对象，即使DOM里没有文本也能返回TextRectangle对象.