为什么 Firefox 滚动到页面顶部取决于页面中显示的内容量？

Question

我有一个网站，页脚有一个指向特定页面状态的链接，例如规则。我说页面状态是因为该网站是单个 HTML 页面，而各个“页面”只是该 HTML 页面的状态，其中显示了某些内容而隐藏了其他内容。页脚内容是相同的，并且在所有页面状态下都可见。

无论页面状态如何，页脚的链接都应该导航到规则页面的顶部。除非从某个特定页面单击页脚链接，否则它会执行此操作，在这种情况下，它会转到“规则”页面的末尾。

在 Chrome 或 Edge 中，无论是此类浏览器的桌面版还是移动版，都不会出现这种异常情况。

与规则页面链接关联的代码脚本是：

/** Moves browser to the Governance page and scrolls to the top of the page
*/
const switchToRulesPage = () => 
{
    if ('scrollRestoration' in history)         
    {
        history.scrollRestoration = 'manual';                                                                           
    }   

    window.scrollTo(0,0);                                                                                               

    switchPage('about-link', 'governance-cont', false);                                                                                     
}

我尝试重新排序上述代码，以便首先完成页面状态切换，然后滚动到顶部。但浏览器行为没有变化。

不管怎样，我已经通过 W3C Validator 从 HTML 页面中删除了所有错误。

Answer 1

我通过实验发现，当点击“规则”链接的页面状态上显示的内容量超过一定数量时，就会出现此异常。当页面状态包含的显示内容少于此时，不再观察到“拒绝”滚动到页面顶部。

在我的例子中，显示异常的页面是新闻页面，即按发布日期从最近到过去两年列出的一系列新闻项目。显然，对于新闻项目来说，这个时间间隔无论如何都太长了，需要修剪。最终，我将新闻项目折叠到最新的新闻项目以及过去 12 个月内后续新闻项目的标题中。每个新项目标题都有一个“阅读更多”按钮来显示完整的新闻项目。在给定时刻只能打开两条新闻 - 最新的一条和任何其他一条。

但我仍然好奇为什么 Firefox 对于大页面有这种“拒绝滚动”的功能，而 Chrome/Edge 没有 - 或者至少在页面状态下显示相当大量（约 8 屏）的显示内容时不会显示异常.

我还根据我的发现修改了该帖子的标题。