让DIV的滚动条⾃动滚动到最底部-4种⽅法
要制作⼀个的程序，在做最后的修饰时，需要对获得的信息即时滚动以保证⽤户总能看到最新消息。
聊天程序是基于AJAX设计的，没有⽤框架，消息容器是⼀个DIV，所以问题就在于如何控制DIV的滚动条。
但同样的代码拿到我这⾥却完全失效，⼜仔细查了下资料说XHTML标准下scrollTop的值恒为0，解决办法是使⽤
document.documentElement.scrollTop代替document.body.scrollTop，讲了半天所解决的是整个页⾯的滚动条。这个⽅法我是⽤不了了，因为不是框架结构，所以不可能⽤body的滚动条控制浏览信息。
⽹上关于这个问题的资料很少，连CSDN上也说没有办法。
不死⼼，后来查DHTML⼿册得知DIV有个doScroll⽅法可以⽤来模拟滚动条点击，但很令⼈失望，到了我这⾥⼜是完全失效，难道⼜不被XHTML⽀持？
网站底部代码js特效
最后终于被我到三种控制DIV内容滚动的⽅法：
⽅法⼀：
使⽤锚标记要滚动到的位置，然后通过click⽅法模拟点击滚动到锚所在位置
<script language="javascript1.2" type="text/javascript">
function onGetMessage(context)
{
msg.innerHTML+=context;
msg_end.click();
}
</script>
<div >
<div id="msg" ></div>
<div><a id="msg_end" name="1" href="#1"> </a></div>
</div>
⽅法⼆：
利⽤DIV的scrollIntoView⽅法，将最底端滚动到可视位置 [list=1]<script
language="javascript1.2"
type="text/javascript">
function onGetMessage(context)
{
msg.innerHTML+=context;
msg_end.scrollIntoView();
}
</script>
<div >
<div id="msg" ></div>
<div id="msg_end" ></div>
</div>
⽅法三：
<div id="scrolldIV" >
</div>
<input type="button" value="插⼊⼀⾏" onclick="add();">
<!--************************************* 实例代码结束 *************************************-->
</div>
</div>
</body>
</html>
⽅法4：
这个⽐较复杂也⽐较灵活⼀点，就是利⽤DIV+JS+图⽚构造⼀个滚动条，当然了图⽚是怎么好看怎么⽤了。
主要部分就是外层的DIV加个overflow:hidden属性，通过js代码调整内层DIV的margin-left和margin-top来控制内容的滚动，由于上⾯两种⽅法已经可以满⾜需求，所以这种⽅法没具体做深究，有兴趣的可以试⼀下
分享到：

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。