反应滚动到 div 的底部 - Javascript

有时候我们需要让滚动条自动滚动到某个元素的底部，这对于聊天窗口、消息列表等场景非常有用。在 Javascript 中实现这个功能也非常简单。

实现方式

假设我们有一个 div 元素，我们需要让它滚动到底部。可以使用以下步骤：

1. 获取 div 元素。
2. 将 div 元素的 scrollTop 值设置为它的 scrollHeight 值。
3. 代码实现如下：

let element = document.getElementById("myDiv");
element.scrollTop = element.scrollHeight;

以上代码会将 id 为 myDiv 的元素滚动到底部。

完整代码

我们可以将上述代码封装到一个函数中，以便在多个地方使用，例如：

function scrollToBottom(id) {
  let element = document.getElementById(id);
  element.scrollTop = element.scrollHeight;
}

使用时，只需传入需要滚动到底部的 div 元素的 id 即可：

scrollToBottom("myDiv");

总结

利用 scrollTop 和 scrollHeight 属性可以很方便地让滚动条滚动到 div 元素的底部。我们可以将这段代码封装成一个函数，在需要时快速调用。