返回顶部和回到底部

最新推荐文章于 2023-03-29 23:21:31 发布

原创最新推荐文章于 2023-03-29 23:21:31 发布 · 490 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#js #jquery #返回顶部 #返回底部 #scrollTop

前端同时被 2 个专栏收录

65 篇文章

订阅专栏

javascript

21 篇文章

订阅专栏

本文介绍了一种利用JQuery的scrollTop()方法实现页面元素滚动到顶部或底部的简便方法。通过具体示例代码，展示了如何在按钮点击事件中调用此方法，使指定的div元素返回到其顶部或底部位置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

经常会有返回顶部、回到底部的需求，推荐一种比较简单的写法
JQ中有 scrollTop() 方法可以帮助我们快速实现该需求

示例：


<html>
<body >
<div class="div1" style="width:200px;height:200px;overflow:auto">This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.</div>
<button  onclick="test()">测试返回</butoon>
</body>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
	function test(){
		 $(".div1").scrollTop(0);//此为滚动条的位置--返回顶部
		 $(".div1").scrollTop($(document).height());//此为滚动条的位置---返回底部 直接取dom的高度
	}
</script>
</html>