您可以使用Element.scrollTo()方法。

它可以使用内置的浏览器/操作系统动画，所以它非常流畅。

function scrollToBottom() { const scrollContainer = document.getElementById('container'); scrollContainer.scrollTo({ top: scrollContainer.scrollHeight, left: 0, behavior: 'smooth' }); } // initialize dummy content const scrollContainer = document.getElementById('container'); const numCards = 100; let contentInnerHtml = ''; for (let i=0; i<numCards; i++) { contentInnerHtml += `<div class="card mb-2"><div class="card-body">Card ${i + 1}</div></div>`; } scrollContainer.innerHTML = contentInnerHtml; .overflow-y-scroll { overflow-y: scroll; } <link href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" rel="stylesheet"/> <div class="d-flex flex-column vh-100"> <div id="container" class="overflow-y-scroll flex-grow-1"></div> <div> <button class="btn btn-primary" onclick="scrollToBottom()">Scroll to bottom</button> </div> </div>

var mydiv = $("#scroll");
mydiv.scrollTop(mydiv.prop("scrollHeight"));

来自jQuery 1.6的工作

https://api.jquery.com/scrollTop/

http://api.jquery.com/prop/

你也可以，使用jQuery，附加一个动画到html，文档的主体通过:

$（“html，body”）.animate（{scrollTop：$（“#div-id”）[0].offsetTop}， 1000）;

这将导致一个平滑的滚动到div顶部，id为“div-id”。

我的场景:我有一个字符串列表，我必须在其中添加用户给定的字符串，并自动滚动到列表的末尾。我已经固定了列表显示的高度，在此之后它应该溢出。

我试过@Jeremy Ruten的答案，它工作，但它滚动到(n-1)个元素。如果有人面临这种类型的问题，可以使用setTimeOut()方法解决。你需要修改代码如下:

setTimeout(() => {
    var objDiv = document.getElementById('div_id');
    objDiv.scrollTop = objDiv.scrollHeight
}, 0)

下面是我创建的StcakBlitz链接，其中显示了问题及其解决方案:https://stackblitz.com/edit/angular-ivy-x9esw8

我发现这真的很有用，谢谢。

对于Angular 1。在座的X位朋友:

angular.module('myApp').controller('myController', ['$scope', '$document',
  function($scope, $document) {

    var overflowScrollElement = $document[0].getElementById('your_overflow_scroll_div');
    overflowScrollElement[0].scrollTop = overflowScrollElement[0].scrollHeight;

  }
]);

只是因为在jQuery元素和HTML DOM元素中包装有点让人困惑。

同样对于聊天应用程序，我发现在你的聊天加载后进行分配是有用的，你也可能需要在短的超时。

滚动到div内的最后一个元素:

myDiv.scrollTop = myDiv.lastChild.offsetTop