jquery页面滚动到底部的方法

在前端web中想要让页的滚动条滚动到页面的底部，可以使用jquery来实现。下面是具体的使用方法。

jq实现页面滚动到底部的方法

jquery中的scrollTop属性用于获取或设置匹配元素相对于滚动条顶部的偏移，也就是设置滚动条滚动的高度。

jquery中的scrollHeight属性则可以获取元素内容的总高度。

将元素滚动条的scrollTop属性设置为元素的scrollHeight获取的高度，就可以让滚动条滚动到页面的底部啦。

例：

以下示例代码，可以让页面的滚动条一直保持在页面的底部。

<script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.js"></script>
<div class="div">
    这是元素的内容
</div>
<script>
$('.div').scrollTop($('.div')[0].scrollHeight);
</script>

例2：

平滑的将页面滚动条滚动到页面的底部。

<script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.js"></script>
<div class="div">
    这是元素的内容
</div>
<button class="but">点击我</button>
<script>
$('.but').on('click',function(){
    $('.div').animate({scrollTop: $('.div')[0].scrollHeight}, 'slow');
});
</script>

以上就是jquery中将滚动条滚动条页面底部的方法，大家可以参考一下。