1、点击按钮移动到底部：
2、点击按钮查看高度值：
需求：当div 中 内容过多出现滚动条时，让滚动条滚动到最下面。scrollTop() 方法返回或设置匹配元素的滚动条的垂直位置。scrollHeight网页内容实际高度代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>demo</title> <style> .out-.
判断
滚动条
到
底部
，需要用到DOM的三个属性值，即
scrollTop
、clientHeight、scrollHeight。
scrollTop
为
滚动条
在Y轴上的
滚动
距离。
clientHeight为内容可视区域的高度。
scrollHeight为内容可视区域的高度加上溢出（
滚动
）的距离。
从这个三个属性的介绍就可以看出来，
滚动条
到
底部
的条件即为
scrollTop
+ clientHeight == scrollHeight。
废话不多少说，赶紧上代码（兼容不同的浏览器）。
lazyload.js
//
滚动条
在Y轴上的
滚动
距离
function get
ScrollTop
(){
$(cli-open).click(function(){
var
scrollTop
= document.body.
scrollTop
;//保存点击前
滚动条
的位置
[removed]=function(){
document.body.
scrollTop
=
scrollTop
;//赋值给
滚动条
的位置
$(.cli-close).click(function(){
[removed]=function(){
这个实例应该说可以很简单，直接使用
jQuery
的方法来处理也是可以的。但本文底层使用原生的js来处理，遇到一些小知识点可以分析一下也算有所得。
原理很简单，就是为window添加一个scroll事件，浏览器每次触发scroll事件时判断是否
滚动
到了浏览器
底部
，如果到了
底部
则加载新数据。关键是计算
滚动条
是否
滚动
到了浏览器
底部
，算法如下
滚动条
卷起来的高度 + 窗口高度 > 文档的总高度 + 50/*我这里将
滚动
响应区域高度取50px*/；如果这个判断为true则表示
滚动条
滚动
到了
底部
。
<style type="text/css">
html,body, div, dl, dt, d
要制作一个在线聊天的程序，在做最后的修饰时，需要对获得的信息即时
滚动
以保证用户总能看到最新消息。
聊天程序是基于AJAX设计的，没有用框架，消息容器是一个DIV，所以问题就在于如何控制DIV的
滚动条
。
但同样的代码拿到我这里却完全失效，又仔细查了下资料说XHTML标准下
scrollTop
的值恒为0，解决办法是使用 document.documentElement.
scrollTop
代替document.body.
scrollTop
，讲了半天所解决的是整个页 面的
滚动条
。这个方法我是用不了了，因为不是框架结构，所以不可能用body的
滚动条
控制浏览信息。
网上关于这个问题的资料很少，连CSDN上也
jQuery
提供的
scrollTop
() 方法，可以用来返回或
设置
匹配元素的
滚动条
的垂直位置。通过这个方法，配合获取到的 scrollHeight。我们可以将一个元素的
滚动条
移动到最
底部
。或者将整个页面
滚动
到最
底部
。1，效果图点击“移动到最
底部
”按钮后，上方的div就会将
滚动条
移动到最下面。2，样例代码<html>
<head>
<script type="tex...
this.$nextTick(() => {
//要滑动的高度= 当前dom的滑动高度 - 当前窗口可视区域高度
var height = $("#scrollBox")[0].scrollHeight - $(window).height();
$("#scrollBox").
scrollTop
(height)
methods: {
loadMoreData(e) {
if (e.target.
scrollTop
=== e.target.scrollHeight - e.target.clientHeight) {
//
滚动
到
底部
, 加载更多数据
this.getMoreData();
getMoreData() {
// 获取更多数据并添加到tableData数组中
</script>
在上面的代码中,我们监听了 `body-scrolling` 事件, 在这个事件中,我们检查表格的 body 是否
滚动
到
底部
. 如果
滚动
到
底部
, 就调用 `getMoreData()` 方法获取更多数据并添加到表格中。
