Javascript getBoundingClientRect是否根据滚动位置动态更改?

Javascript getBoundingClientRect是否根据滚动位置动态更改?,javascript,html,reactjs,dom,Javascript,Html,Reactjs,Dom,下面的代码有什么问题getBoundingClientRect值并不总是相同的,当我在滚动后启动函数时,它会发生变化。如果我没有滚动页面,下面的函数仅精确(滚动到正确的位置) scrollToTargetAdjusted() { const element = document.getElementById('myDiv') const dockingElementOffset = 80 const elementPosition = element.getBoundingCl

下面的代码有什么问题
getBoundingClientRect
值并不总是相同的,当我在滚动后启动函数时,它会发生变化。如果我没有滚动页面,下面的函数仅精确(滚动到正确的位置)

scrollToTargetAdjusted() {
   const element = document.getElementById('myDiv')
   const dockingElementOffset = 80
   const elementPosition = element.getBoundingClientRect().top
   const offsetPosition = elementPosition - dockingElementOffset

    window.scrollTo({
      top: offsetPosition,
      behavior: 'smooth'
    })
}
我没有使用滚动视图,因为我需要一个偏移量。

根据:

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

计算边界矩形时,将考虑视口区域(或任何其他可滚动元素)已完成的滚动量。这意味着每当滚动位置更改时,矩形的边界边(上、右、下、左)都会更改其值(因为它们的值是相对于视口的,而不是绝对的)

如果需要相对于文档左上角的边框,只需将当前滚动位置添加到顶部和左侧属性(可以使用window.scrollX和window.scrollY获得这些属性),即可获得独立于当前滚动位置的边框

因此:


您可以发布getBoundingClientReact()吗?如果您因专有原因无法回答,我们可以尝试不回答。
window.scrollTo({
  top: offsetPosition +  // based on getBoundingClientRect().top
       window.scrollY,
  behavior: 'smooth'
})