一、a标签指向id

<a href="#top" style="position: absolute;top: 2500px;">点我回到顶部</a>

默认#top为回到顶部，top可以更换成任何前文出现过的id。

效果为瞬间定位，定位到id对应内容在页面最靠上的位置。

二、a标签指向a标签锚点

<body>
	<a name="test">点我回到顶部</a>`
	<div>...</div>
	<a href="#test" style="position: absolute;top: 2500px;">点我回到顶部</a>`
</body>

定位到对应name名的a标签上，只能是a标签。

效果为瞬间定位。

三、js控制Windows事件

<a style="position: absolute;top: 2000px;" href="javascript:window.scrollTo(0,0)">

返回x=0，y=0的位置。默认效果为瞬间定位。

至于获取坐标，则略麻烦：JS dom元素相关尺寸、位置、以及鼠标坐标位置_哎呀小新的博客-CSDN博客

可使用behavior：'smooth'改为平滑滚动。详见 js临时笔记。

四、jQuery带动画的返回

<body>
    <div class="header">我在顶部</div>
    <!-- 很多内容 -->
    <br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br>
    <!-- 很多内容 -->
    <img class="footer" id="gotoTop" src="https://i02piccdn.sogoucdn.com/4f3b2858eec9e2cf" alt="">
 
    <script>
        function gotoTop(minHeight){
 
            // 定义点击返回顶部图标后向上滚动的动画
            $("#gotoTop").click(
                function(){$('html,body').animate({scrollTop:'0px'},'slow');
            })
 
            // 获取页面的最小高度，无传入值则默认为600像素
            minHeight? minHeight = minHeight:minHeight = 600;
 
            // 为窗口的scroll事件绑定处理函数
            $(window).scroll(function(){
 
                // 获取窗口的滚动条的垂直滚动距离
                var s = $(window).scrollTop();
 
                // 当窗口的滚动条的垂直距离大于页面的最小高度时，让返回顶部图标渐现，否则渐隐
                if( s > minHeight){
                    $("#gotoTop").fadeIn(500);
                }else{
                    $("#gotoTop").fadeOut(500);
                };
            });
        };
        gotoTop();
    </script>
</body>