Vanilla JavaScript:滚动到页面顶部

Question

我可能错过了一些东西,但我无法window.scrollTo(0,0)移动到页面顶部.

我正在实现一个aside很好用的粘性.它用于.getBoundingClientRect()获得初始位置.

但是,如果页面部分滚动,并且我刷新页面,它会错误地读取位置,并且位于错误的位置.

我虽然通过window.scrollTo(0,0)在开头执行来解决这个问题,所以页面位于顶部,并且aside位于正确的位置.

当我运行代码时,window.scrollTo(0,0)似乎没有任何区别.

让重新加载的窗口从顶部开始的正确方法是什么？

我在Mac上的Firefox上测试过它.Chrome和Safari提供了类似的行为.

拜托,没有jQuery.

Answer 1

现在，在 javascript 中使用滚动效果转到页面顶部更加容易：

https://developer.mozilla.org/en-US/docs/Web/API/Window/scroll

window.scroll({
 top: 0, 
 left: 0, 
 behavior: 'smooth' 
});

警告

我刚刚在更新我的答案时检查了 mozilla 文档，我相信它已经更新了。现在的方法是 window.scroll(x-coord, y-coord) 并且没有提及或显示使用 object 参数的示例，您可以在其中将行为设置为平滑。我刚刚尝试了代码，它仍然可以在 Chrome 和 Firefox 中使用，并且对象参数仍然在规范中。

或者在 Vanilla 中，您可以将 window.onload 事件与scrollTo(x,y) 函数一起使用

window.onload = function(){
    window.scrollTo(0,0);
}

Answer 2

你有没有尝试在scrollTo之前等待页面加载？尝试使用window.onload

window.onload = function(){
    window.scrollTo(0,0);
}