使用Javascript滚动到列表底部

Question

我有一个for循环产生一个列表，我希望滚动条在页面打开时从列表的底部开始，但我似乎无法在看到所有可用的解决方案后开始工作。 这里是我的代码：

HTML：

<div class="js-conversation" id="msg-list"> 
<div class="modal-body-scroller"> 
<ul class="media-list-conversation"> 
{% for msg in messages | sort(attribute='timestamp') %} 
<li> 
...list html... 
</l> 
{% endfor %} 
</ul> 
</div> 
</div> 

这里是JavaScript：

var objDiv = document.getElementById("msg-list"); 
objDiv.scrollTop = objDiv.scrollHeight; 

我试图移动ID = “MSG-名单” 左右，但它已不能大意任何地方。 任何帮助将不胜感激。

Answer 1

添加jquery，然后滚动到所需的元素。

<script 
    src="https://code.jquery.com/jquery-1.12.4.min.js" 
    integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" 
    crossorigin="anonymous"></script> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      $('html,body').animate({ 
       scrollTop: $(".media-list-conversation").offset().top+$(".media-list-conversation").height() 
       }, 
      'slow'); 
     }) 
    </script> 

更新：

我已经创建了一个例子：https://jsfiddle.net/j1oqv7xf/。它有多个带有虚拟文本的div元素和一个带有红色边框的所需div。当页面加载完成时，页面会滚动到所需的div底部。