简答
如果 URL 发生变化（导航），则应使用链接，其他一切都应使用按钮。 <a href="#" 不是一个好的做法，但对于 SPA，如果您的链接文本准确且详细，应该没问题。避免平滑滚动或给人们一种关闭它的方法，因为它可能会让人迷失方向。
更长的答案
我给了相当多的extensive answer on <a> vs <button> in SPAs here，所以我希望这足以回答一般用例在什么场景中使用哪个。
关于网址中的#，由于您事先不知道网址。如果 URL 未知，则以 # 开头会更好，然后在知道要将人员路由到哪里后更新 href。
这是因为answer I linked 中讨论的关于放心的原因，即知道链接会将我带到哪里。
显然，如果您无法做到这一点，请确保链接文本具有很强的描述性，这样我就可以确信我会去正确的地方。
在 SPA 中滚动
关于滚动到页面的不同部分，这仍然是您所说的链接，假设您使用#section-name 更新网址。 您应该这样做，但如果您的应用程序路由器无法处理 URL 片段，那么我根本不会更新 URL 并将其更改为按钮。
在这个阶段，我会在按钮中使用一些视觉上隐藏的文本来解释它会滚动到当前页面上的某个部分。
下面的例子说明了这一点。 请使用下面的 CSS 类在视觉上隐藏文本，因为它有 better compatibility than bootstrap sr-only class as explained in this answer I gave。
.visually-hidden {
border: 0;
padding: 0;
margin: 0;
position: absolute !important;
height: 1px;
width: 1px;
overflow: hidden;
clip: rect(1px 1px 1px 1px); /* IE6, IE7 - a 0 height clip, off to the bottom right of the visible 1px box */
clip: rect(1px, 1px, 1px, 1px); /*maybe deprecated but we need to support legacy browsers */
clip-path: inset(50%); /*modern browsers, clip-path works inwards from each corner*/
white-space: nowrap; /* added line to stop words getting smushed together (as they go onto seperate lines and some screen readers do not understand line feeds as a space */
}
<button><span class="visually-hidden">Go To </span>Section name<span class="visually-hidden"> on this page</span></button>
关于平滑滚动的简短说明
最后，我要提醒您使用平滑滚动。如果您使用此功能，请确保有办法将其关闭，因为它可能会分散运动障碍或焦虑症患者的注意力或迷失方向。
一种方法是使用 CSS 媒体查询 prefers-reduced-motion。
最后的想法
如果没有看到每种情况，很难给出 100% 明确的答案，如果您可以尝试遵循标准导航模式的按钮来执行同一页面操作、带有 url 片段的链接用于导航到同一页面的各个部分以及链接到其他页面页面，即使这些是通过 AJAX 处理并且仅部分重新加载。
显然这是目标，我知道对于某些路由解决方案，这并不总是可行的，在这种情况下，请使用您的最佳判断并使用屏幕阅读器测试它，因为屏幕阅读器用户最有可能在 SPA 中遭受结构不良的导航系统的困扰。
最后一个提示 - 如果您确实在 SPA 中更改页面，请使用 tabindex="-1" 以编程方式将下一页上的 <h1> 设为焦点，并在页面加载后将其设为焦点。这是让几乎没有远见的用户知道使用 AJAX 在 SPA 中完成导航的好方法。