Javascript 页面加载时滚动至底部

我有以下代码，这是我使用Firebase API得到的聊天显示。 问题是，当页面加载时，我希望它直接将滚动条设置在底部。目前，它有点缓慢地滑到底部（因为.animate）。 当我重新加载页面时，如何使滚动条始终保持在底部，即使聊天中添加了新内容

$(document).ready(function () {    
    var myDataRef = new Firebase('https://ot7fwnsj7h7.firebaseio-demo.com/');
    myDataRef.on('child_added', function (snapshot) {
        var message = snapshot.val();
        displayChatMessage(message.name, message.text);
    });

    function displayChatMessage(name, text) {
        $('<div/>').text(text).prepend($('<em/>').text(name + ': ')).appendTo($('#displayChat'));
        // make text scroll everytime someone posts
        $('#displayChat').animate({
            scrollTop: $("#displayChat")[0].scrollHeight
        }, 'slow');
    };
});

$（文档）.ready（函数（）{
var myDataRef=new Firebase（'https://ot7fwnsj7h7.firebaseio-demo.com/');
myDataRef.on（'child_added'，函数（快照）{
var message=snapshot.val（）；
displayChatMessage（message.name，message.text）；
});
函数displayChatMessage（名称、文本）{
$（''）.text（text）.prepend（$（''）.text（name+'：'））.appendTo（$（'#displayChat'））；
//每次有人发帖时使文本滚动
$（'#displayChat'）。设置动画({
scrollTop:$（“#displayChat”）[0]。scrollHeight
}“慢”）；
};
});

这是我的小提琴：

---

我希望我已经清楚了！谢谢

这行代码将元素滚动到底部。 每次更新视图时调用它

---

我想你想要的是这个而不是你的动画代码：

$（'#displayChat'）.scrollTop（$（“#displayChat”）.height（）

您还希望在每次添加消息时都使用它—它会将滚动条带到div的底部。
添加
$（'#displayChat'）。滚动条（0）
怎么样？
$("#displayChat")[0].scrollTop =  $("#displayChat")[0].scrollHeight