获取元素相对于文档的位置.md

获取元素相对于文档的位置

要获取元素相对于文档的位置，可以使用 getBoundingClientRect() 方法。这个方法返回一个 DOMRect 对象，包含了元素的 left、top、right、bottom、width 和 height 属性，表示元素相对于视口的位置。

// 获取元素相对于视口的位置
const rect = ele.getBoundingClientRect()

// 添加滚动位置以获取与元素的完整距离到文档的顶部左侧
const x = rect.left + window.pageXOffset
const y = rect.top + window.pageYOffset

这里，我们首先使用 getBoundingClientRect() 方法获取元素相对于视口的位置，然后将 left 和 top 属性加上页面的水平和垂直滚动偏移量，就可以得到元素相对于文档的位置。

如果你需要计算元素相对于父元素的位置，则可以使用 element.offsetTop 和 element.offsetLeft 属性来获取。

const x = element.offsetLeft
const y = element.offsetTop

这里，我们获取到了元素相对于它父元素左上角的水平和垂直偏移量。