给div"上"滑动条

最近做项目时修改一个遗留的bug,大概是这样:有一个聊天窗口,用户聊天内容展现在窗口上。其实这个窗口是一个带滑动条的div,随着聊天内容的添加,滑动条也越来越长了,这不是重点,重点是每次刷新窗口时候,滑动条的内容都是显示前面的内容,可是实际是我们希望聊天内容展示给用户的,应该是最后的内容,这就驱动了一个小功能,如何让滑动条在窗口刷新的时候总是在停留在底端。

    Demo:   

  <!DOCTYPE html>
    <html>
      <head>
      <meta charset="utf-8">
      <title>div添加滑动条</title>
      </head>
    <body>
      <div style="260px;height:60px; overflow:auto; border:1px solid;" >
                     var divContain = document.getElementById('divContain');
                     //TODO 滚动条滑到底部
                     $('#divContain').scrollTop( divContain.scrollHeight); //.scrollHeight这个是js的属性
              </script>
             </body>
         </html>

          没有执行这句js的时候,每次内容刷新老是显示在前头,看到以下哪个滑动条呆在首行没,哪有用户每次发完信息,就滚动到最后查看最新消息的喔

          $('#divContain').scrollTop( divContain.scrollHeight); //.scrollHeight这个是js的属性

          给div"上"滑动条

        执行以上这句代码后,滑动条永远呆在下面了,用户不用手动拉到最后看消息了

        给div"上"滑动条

         divContain.scrollHeight这个很重要,主要是说滑动条的长度.... scrollHeight是一个属性

         哈哈,小功能完成了,收工睡觉撒。