javascript - 有没有办法检测具有特定类的 div 并将顶部滚动条移动到其父 div 内的位置？

Question

HTML:

<div id="parent">
    <div class="myDiv"></div>
    <div class="myDiv"></div>
    <div class="myDiv mySelectedDiv"></div>
    <div class="myDiv"></div>
</div>

我将 mySelectedDiv 类动态附加到 div，一次一个。我希望滚动条位于所选的 div 处。有什么建议吗？

我尝试使用下面的代码在所选 div 的位置上下移动滚动条。但当 div 的高度发生变化时，它不太准确，在我的例子中就是这样。

element.scrollBy({
      top: 100,
      behavior: "smooth"
    })

Answer 1

您应该可以使用window.scrollTo()来做到这一点获得元素相对于窗口或容器或任何对您有利的顶部 Y 坐标后。

第二部分可能在 stackoverflow 上有很多答案:) https://stackoverflow.com/search?q=get+element+top+position

<小时/>

编辑:如果您不关心旧浏览器，您也可以尝试这个新的 API:https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView

编辑 2: 正如@mplungjan 在评论中指出的那样，实际上所有浏览器都支持这一点，甚至是 IE6 等旧浏览器。至少，基本语法。然而，它被认为是一种未标准化的实验技术，因此可能需要对其进行良好的测试。