新增加的内容是如何将div的scrollbar自动移动最下面


Posted in Javascript onJanuary 02, 2014

有时候我们在做动态增长的div时,一般都是将内容append到div的最下面,但这会带来一个比较蛋疼的问题,那就是新增加的内容会被遮在最下面,比如这样
新增加的内容是如何将div的scrollbar自动移动最下面
如何才能让scrollbar自动移动最下面呢,这就需要js的帮助了,假设div的id为myDiv,那么使用原生的js实现如下:

var myDiv = document.getElementById('myDiv');  
myDiv.scrollTop = myDiv.scrollHeight;

如果使用jquery的话,也很简单
var $div = $('#myDiv');  
$div.scrollTop($div[0].scrollHeight);
Javascript 相关文章推荐
采用CSS和JS,刚好我最近有个站点要用到下拉菜单!
Jun 26 Javascript
正则表达式判断是否存在中文和全角字符和判断包含中文字符串长度
Sep 27 Javascript
在服务端(Page.Write)调用自定义的JS方法详解
Aug 09 Javascript
JS 实现导航栏悬停效果
Sep 23 Javascript
jQuery窗口、文档、网页各种高度的精确理解
Jul 02 Javascript
原生js和jquery实现图片轮播淡入淡出效果
Apr 23 Javascript
jquery简单实现图片切换效果的方法
May 12 Javascript
JavaScript实现的XML与JSON互转功能详解
Feb 16 Javascript
浅析Proxy可以优化vue的数据监听机制问题及实现思路
Nov 29 Javascript
详解Node.js amqplib 连接 Rabbit MQ最佳实践
Jan 24 Javascript
vue组件命名和props命名代码详解
Sep 01 Javascript
微信小程序中的列表切换功能实例代码详解
Jun 09 Javascript
javascript中处理时间戳为日期格式的方法
Jan 02 #Javascript
JS脚本defer的作用示例介绍
Jan 02 #Javascript
Javascript中常见的校验如域名、手机、邮箱等等
Jan 02 #Javascript
JavaScript四种调用模式和this示例介绍
Jan 02 #Javascript
ParseInt函数参数设置介绍
Jan 02 #Javascript
JS中Date日期函数中的参数使用介绍
Jan 02 #Javascript
JavaScript中Math对象方法使用概述
Jan 02 #Javascript
You might like
基于php缓存的详解
2013/05/15 PHP
PHP邮件群发机实现代码
2016/02/16 PHP
php简单随机字符串生成方法示例
2017/04/19 PHP
JS实现切换标签页效果实例代码
2013/11/01 Javascript
浅析JavaScript中的类型和对象
2013/11/29 Javascript
解析JavaScript中instanceof对于不同的构造器或许都返回true
2013/12/03 Javascript
IE中图片的onload事件无效问题和解决方法
2014/06/06 Javascript
javascript基于HTML5 canvas制作画箭头组件
2014/06/25 Javascript
Underscore.js常用方法总结
2015/02/28 Javascript
详解jQuery lazyload 懒加载
2016/12/19 Javascript
Angularjs 动态改变title标题(兼容ios)
2016/12/29 Javascript
JavaScript和JQuery获取DIV值的方法示例
2017/03/07 Javascript
node文件上传功能简易实现代码
2017/06/16 Javascript
jQuery EasyUI结合zTree树形结构制作web页面
2017/09/01 jQuery
详解vue中axios的使用与封装
2019/03/20 Javascript
webpack 处理CSS资源的实现
2019/09/27 Javascript
你可能从未使用过的11+个JavaScript特性(小结)
2020/01/08 Javascript
简单了解three.js 着色器材质
2020/08/03 Javascript
详解React路由传参方法汇总记录
2020/11/29 Javascript
[04:07]显微镜下的DOTA2第八期——英雄复活动作
2014/06/24 DOTA
[02:56]DOTA2上海特锦赛小组赛解说FreeAgain采访花絮
2016/02/27 DOTA
Python处理字符串之isspace()方法的使用
2015/05/19 Python
如何使用七牛Python SDK写一个同步脚本及使用教程
2015/08/23 Python
python+pygame简单画板实现代码实例
2017/12/13 Python
python 根据时间来生成唯一的字符串方法
2019/01/14 Python
如何安装2019Pycharm最新版本(详细教程)
2019/09/26 Python
详解python opencv、scikit-image和PIL图像处理库比较
2019/12/26 Python
win10安装python3.6的常见问题
2020/07/01 Python
matplotlib基础绘图命令之imshow的使用
2020/08/13 Python
采购部部门职责
2013/12/15 职场文书
称象教学反思
2014/02/03 职场文书
国际贸易本科毕业生求职信
2014/09/26 职场文书
机关保密工作承诺书
2015/05/04 职场文书
毕业论文致谢部分怎么写
2015/05/14 职场文书
幼儿园六一儿童节开幕词
2016/03/04 职场文书
Mysql中存储引擎的区别及比较
2021/06/04 MySQL