最近做项目时修改一个遗留的bug，大概是这样:有一个聊天窗口，用户聊天内容展现在窗口上。其实这个窗口是一个带滑动条的div，随着聊天内容的添加，滑动条也越来越长了，这不是重点，重点是每次刷新窗口时候，滑动条的内容都是显示前面的内容，可是实际是我们希望聊天内容展示给用户的，应该是最后的内容，这就驱动了一个小功能，如何让滑动条在窗口刷新的时候总是在停留在底端。
Demo:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>div添加滑动条</title>
</head>
<body>
<div style="width:260px;height:60px; overflow:auto; border:1px solid;" id="divContain">
这里是你要显示的内容 ，怎么说好。人怎么能如此无情尼，哈哈，毕业那年啊，老师都很失望，对我；
这里是你要显示的内容 ，怎么说好。人怎么能如此无情尼，哈哈，毕业那年啊，老师都很失望，对我；
这里是你要显示的内容 ，怎么说好。人怎么能如此无情尼，哈哈，毕业那年啊，老师都很失望，对我；
这里是你要显示的内容 ，怎么说好。人怎么能如此无情尼，哈哈，毕业那年啊，老师都很失望，对我；
这里是你要显示的内容 ，怎么说好。人怎么能如此无情尼，哈哈，毕业那年啊，老师都很失望，对我；
这里是你要显示的内容 ，怎么说好。人怎么能如此无情尼，哈哈，毕业那年啊，老师都很失望，对我；
</div>
<script type="text/javascript" src="js/jquery-3.2.1.min.js" ></script>
<script type="text/javascript">
var divContain = document.getElementById('divContain');
//TODO 滚动条滑到底部
$('#divContain').scrollTop( divContain.scrollHeight); //.scrollHeight这个是js的属性
</script>
</body>
</html>
没有执行这句js的时候，每次内容刷新老是显示在前头，看到以下哪个滑动条呆在首行没，哪有用户每次发完信息，就滚动到最后查看最新消息的喔
$('#divContain').scrollTop( divContain.scrollHeight); //.scrollHeight这个是js的属性
执行以上这句代码后，滑动条永远呆在下面了，用户不用手动拉到最后看消息了
divContain.scrollHeight这个很重要，主要是说滑动条的长度.... scrollHeight是一个属性
哈哈，小功能完成了，收工睡觉撒。