如何快速使用这几种方法回到网页顶部？

本文共计1275个文字，预计阅读时间需要6分钟。

背景介绍+当页面内容很多时，用户可能会直接滑动页面。但当他想返回页面顶部进行其他操作时，可能需要不断滚动鼠标，这导致用户体验将大大降低。

背景介绍

当页面内容很多的时候，用户可能会一直往下滑动页面。但是当他想返回页面顶部进行其他操作时，他可能需要不断滚动鼠标滚轮，这就导致用户体验将很差。鉴于这种情况， “回到顶部”这一功能便出现了。

如今在我们浏览网站的时候，常常能遇见“回到顶部”这个按钮。目前主流的回到页面顶部分表现为两种，一种是直接回到页面的顶部，这种方式简单粗暴；另外一种则是自动滚动间接回到页面顶部，这样一来视觉体验上可能更好，但是用户需要过几秒才能看到顶部内容。

例如掘金，在滚动到一定高度时会出现“回到顶部”按钮，点击后会直接回到页面顶部，就是上文说到的第一种情况。

实现 动态显示滚动按钮

“回到顶部”并不是一直显示的，而是滚动到一定值才出现的，因此应该在window.onscroll里定义一个判断事件。