我有一个单页应用程序。有一个包含产品的页面，底部有一个转到下一页的链接。单击此“下一个”链接后，DOM 中的产品列表将被替换。虽然单击的链接保持不变并保持单击的焦点。在这种情况下，我做类似 document.activeElement.blur() 的事情是否更好？或者我应该把注意力集中在这个问题上？
我不确定最佳实践是什么，就像普通服务器路由页面一样，焦点将随着页面加载而重置。但我还没有看到任何信息表明从可访问性的 Angular 来看，手动重置对客户端路由的关注将是最佳体验。
最佳答案
永远不要使用模糊。这很糟糕、随机而且可能令人沮丧。
在原生应用程序中，您应该始终准确地知道焦点在哪里，并且焦点应该始终位于精确的位置；否则键盘辅助功能将被破坏。 如果您认为您的网络应用程序是真正的应用程序，那么您应该遵守同样的严格要求。
所以，永远不要使用模糊，因为你根本不知道焦点之后会移动到哪里。如果您要从当前具有焦点的 DOM 中删除某些内容，您应该首先将其放置在另一个有意义的位置。
就您的情况而言:单击链接，您有两个合理的选择:
- 将焦点保留在链接上(只要不移动、隐藏或从 DOM 中删除它即可)
- 将焦点移到刚刚出现/刚刚替换的新内容的开头
您可以询问应用程序的用户他们认为哪种解决方案最好，或者通过在测试 session 期间观察他们来推断答案。
让我们快速总结一下:无论您是在制作一个具有不同页面的旧式网站，并且不必太关心焦点，还是在制作一个真正的应用程序，在这种情况下您应该像开发 native 应用程序一样严谨。 非常简单。
关于javascript - 焦点模糊于 SPA 的理想客户端路由吗？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50789677/