Javascript 有新消息时向下滚动的聊天

我正在创建一个网络聊天，但我有一个问题：当他们发送消息时，聊天不会向下滚动。我认为你应该使用JavaScript，但我对它不是很有经验

这是HTML代码：

“message”是包含聊天和收到的消息的框

CSS代码（如果有用，但我不认为）：

#消息{
背景颜色：黄色；
边缘底部：32px；
身高：86%；
溢出：自动；
文本对齐：左对齐；
溢出x：隐藏；
左缘：5%；
宽度：90%；
盒影：-1px4px28px0pxRGBA（0,0,0,0.75）；
}

当有消息时，如何使滚动条自动向下移动？

---

我尝试了一些代码，它们可以工作，但当我想回去重读邮件时，它不会让我走。

您可以滚动到带有此代码的

邮件

容器的底部

window.scrollTo(0,document.querySelector("#messages").scrollHeight);

---

您需要将此代码绑定到控制接收消息的

事件
。我无法编写这部分代码，因为您的问题缺少事件部分。
在javascript部分尝试以下内容：

const messageBox = document.querySelector("#messages");
messageBox.animate({scrollTop:messageBox.scrollHeight});

如果失败，则使用此选项：

const messageBox = document.querySelector("#messages");
messageBox.animate({scrollTop:messageBox[0].scrollHeight});

其中一个会起作用。检查并给我反馈是否有效。
因为您的问题缺少一些部分。因此，您应该自己将此代码放入事件函数中。当收到/发送新消息时，此代码将自动执行到消息框底部。您能告诉我要放置的事件吗？在哪里，代码没有work@LSnake你在哪里使用这个代码？听着，在发送消息时，您必须将此代码放入onsubmit事件中。我不知道您在JavaScript代码中做了什么。所以我不能清楚地告诉你在哪里你必须添加这个代码。嗨！我试过这个代码，但不起作用。。。我不知道我是否错了一个事件，我把它放在“内容dx”中，还是应该放在“消息”中？不管怎样，这对我不起作用：（@LSnake当您的代码从聊天应用程序收到新消息时，会有偶数触发器。您应该将此代码包含在
事件中。
事件可以是
提交
事件，当您单击提交按钮或按enter键将消息提交到服务器时，
会触发该事件。通过查看您的代码，您已经有一个提交处理程序
Invio（）
这样，将事件放入submit中，仅在我提交时有效？我希望每次有人发送新消息时它都有效，但我尝试过它不起作用。代码：/@LSnake您应该有一个
服务器
侦听提交的消息。这通常是通过在服务器端（您的后端）使用
socket.io
来完成的。您的后端应该发出一条接收到的消息，这应该会触发您的滚动。是的，我使用了“发出”，事实上它不起作用很奇怪。我尝试了您的代码，前几天我做了类似的事情，但它不起作用。因为，我将滚动功能放入div content dx onchange=myfunc（）中调用函数时，此代码将简单地滚动div。无论您使用何种机制，只要有新消息传入，您就可以调用它。我已解决了！谢谢大家的回答。
const messageBox = document.querySelector("#messages");
messageBox.animate({scrollTop:messageBox[0].scrollHeight});