使用href =“＃”制作页面滚动顶部

Question

在我的可滚动页面的底部，我得到一个“回到顶部”的按钮，我不确定是否只使用href="#"来完成这项工作。我也知道一些函数/脚本也解决了这个问题，但我很容易被这种非常简单的方法所吸引。

所以我的问题是：如果是关于scrolltotop-job的话，使用href="#"的具体缺点或危险是什么？

Answer 1

锚标记用于页面内的导航。如果将其留空，则正常的行为将是滚动到页面顶部。你正在乱扔垃圾，这是一种不好的行为。我建议在页面顶部添加一个vissualy隐藏的跨度，并为此div提供一个ID。这样您就可以在href中引用此ID。使用scroll-behavior: smooth属性，您可以通过这种方式添加非常流畅的滚动功能

其他解决方案将是javascript。

＆＃13;

＆＃13;

div{ height: 100vh; }
a { position: fixed; top: 50%; left: 50vh; }
#upper{ position: absolute; top: 0; }

＆＃13;

<span id="upper"></span>
<div><h1>Title</h1></div>
<div><h1>Title</h1></div>
<div><h1>Title</h1></div>
<div><h1>Title</h1></div>
<div><h1>Title</h1></div>
<a href="#upper">Back to top</a>

＆＃13;

＆＃13;

＆＃13;