时间戳

首页 > 解决方案 > 有没有办法检测具有特定类的 div 并将顶部滚动条移动到它在父 div 内的位置？

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

问题描述

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"
    })

标签： javascript

解决方案

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 等旧浏览器。至少，基本语法。但是，它被认为是一种未标准化的实验技术，因此可能需要对其进行很好的测试。

推荐阅读