Javascript 滚动到具有固定高度的div中的元素

我有一个固定高度的

和

overflow-y:scroll

。在这个div中，我主要有一个

标记，它包含一个长文本，带有一些highlithing（带有背景色和编号id属性的跨距）

顺便说一下，它是一个带有AngularJS的HTMl5应用程序

现在我想实现一个按钮来跳过突出显示的位置：我想让div滚动到正确的位置，页面的其余部分保持不变，即“未滚动”。 如何实现div被滚动到正确的位置，而不是整个页面被向下滚动，从而干扰页面布局

原则上，我知道我可以在url中使用hashtag+id来访问具有给定id的元素-我还从AngularJS中找到$anchorScroll，但这似乎不是正确的方法，因为它可以向下滚动整个浏览器内容，而不仅仅是在我的可滚动div中

几年前，由于使用iframe并不难看，因此使用iframe很容易做到这一点；然而，今天，我认为必须有更好的解决办法

感谢您的帮助！

---

提前感谢。

如果我理解正确，如果您愿意使用JS和JQuery，这个问题已经在这里得到了回答。只需将代码建议附加到按钮上

---

以下是一个可能对您有所帮助的示例。它使用jQuery在目标

上设置

scrollTop

，而不滚动文档的其余部分

要使用它，请在

字段中输入一个介于0-99之间的数字，然后单击

提交

。

div

应该滚动到

元素的顶部（在目标

div

中），并带有该数字

id

请注意，调用

scrollTop（）

中的值针对目标元素的高度进行了更正

for（变量i=0；i<100；i++）{
// http://www.paulirish.com/2009/random-hex-color-code-snippets/
var randomColor='#'+Math.floor（Math.random（）*16777215）.toString（16）；
$（“#myScrollingDiv”）.append（“#”+i+”：text
”）
}
$（“#myForm”）.submit（函数（事件）{
event.preventDefault（）；
var idNumber=$（“#idNumber”）.val（）
var targetElem=$（“#”+idNumber）；
var targetOffset=targetElem.offset（）；
var divScrollTop=$（'#myScrollingDiv'）。scrollTop（）；
$（'#myScrollingDiv'）.scrollTop（divScrollTop+targetOffset.top-targetElem.height（））；
});
正文{
高度：5000px；
溢出y：滚动；
}
#迈斯克罗林迪夫{
溢出y：滚动；
高度：100px；
宽度：150px；
}

输入一个数字ID:
尝试在我的真实环境中调整您的样本时，我遇到的问题是，滚动位置总是添加了一个常数错误的偏移量，即滚动太远。那么，您能否解释一下为什么在示例中使用
.scrollTop（…-targetElem.height（）*3）
？为什么
*3
？我用试错法得到了
*3
），但是，在这种情况下，我认为这是
表单的结果
高度+文本行
输入一个数字ID:
+您滚动到的元素的高度。在这种情况下，这三个值恰好接近相等。我修改了这个例子，所以你只需要修正元素的高度。