你需要获得你想要滚动到视图中的元素的顶部偏移量，相对于它的父元素(滚动div容器):

var myElement = document.getElementById('element_within_div');
var topPos = myElement.offsetTop;

变量topPos现在被设置为滚动div的顶部与您希望可见的元素之间的距离(以像素为单位)。

现在我们使用scrollTop命令让div滚动到那个位置:

document.getElementById('scrolling_div').scrollTop = topPos;

如果你正在使用原型JS框架，你会做同样的事情:

var posArray = $('element_within_div').positionedOffset();
$('scrolling_div').scrollTop = posArray[1];

同样，这将滚动div，以便您希望看到的元素恰好位于顶部(如果不可能，则尽可能向下滚动，使其可见)。

其他答案都不能解决我的问题。

我摆弄了scrollIntoView参数，并设法找到了一个解决方案。将inline设置为开始并将block设置为最近的位置，以防止父元素(或整个页面)滚动:

document.getElementById(chr).scrollIntoView({
   behavior: 'smooth',
   block: 'nearest',
   inline: 'start'
});

如果你正在使用jQuery，你可以使用以下命令滚动动画:

$(MyContainerDiv).animate({scrollTop: $(MyContainerDiv).scrollTop() + ($('element_within_div').offset().top - $(MyContainerDiv).offset().top)});

动画是可选的:你也可以把上面计算出来的scrollTop值直接放到容器的scrollTop属性中。

浏览器会自动滚动到一个获得焦点的元素，所以你也可以做它来包装你需要滚动到的元素<a>…</a>然后当你需要滚动时将焦点设置在a上

你需要获得你想要滚动到视图中的元素的顶部偏移量，相对于它的父元素(滚动div容器):

var myElement = document.getElementById('element_within_div');
var topPos = myElement.offsetTop;

变量topPos现在被设置为滚动div的顶部与您希望可见的元素之间的距离(以像素为单位)。

现在我们使用scrollTop命令让div滚动到那个位置:

document.getElementById('scrolling_div').scrollTop = topPos;

如果你正在使用原型JS框架，你会做同样的事情:

var posArray = $('element_within_div').positionedOffset();
$('scrolling_div').scrollTop = posArray[1];

同样，这将滚动div，以便您希望看到的元素恰好位于顶部(如果不可能，则尽可能向下滚动，使其可见)。

我们可以在不使用JQuery和其他库的情况下解决这个问题。

为此，我编写了以下代码:

你有相似的结构，>

<div class="parent">
  <div class="child-one">

  </div>
  <div class="child-two">

  </div>
</div>

JS:

scrollToElement() {
  var parentElement = document.querySelector('.parent');
  var childElement = document.querySelector('.child-two');

  parentElement.scrollTop = childElement.offsetTop - parentElement.offsetTop;
}

我们可以很容易地重写这个方法，以参数的形式传递父和子