Window scrollTo() 方法

什么是 scrollTo() 方法？

scrollTo() 方法是 Window 对象的一个方法，用于将窗口滚动到指定的坐标位置。这个方法接受两个参数，分别是水平和垂直滚动的坐标位置。例如，window.scrollTo(0, 100) 表示将窗口滚动到水平位置0，垂直位置100。

如何使用 scrollTo() 方法？

使用 scrollTo() 方法非常简单，只需要调用 window.scrollTo() 并传入对应的坐标值即可。下面是一个示例代码：

window.scrollTo(0, 100);

上面的代码将会使页面滚动到垂直位置100的地方。

scrollTo() 方法的常见用途

滚动到页面顶部

要让页面滚动到顶部，只需要将垂直坐标位置设置为0即可：

window.scrollTo(0, 0);

滚动到指定元素位置

有时候我们需要让页面滚动到指定元素的位置，可以通过获取元素的 offsetTop 属性来实现：

const element = document.getElementById('targetElement');
window.scrollTo(0, element.offsetTop);

平滑滚动效果

如果希望页面滚动具有平滑的效果，可以使用 scrollTo() 方法的升级版 scroll() 方法，并传入 behavior: 'smooth' 参数：

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

总结

scrollTo() 方法是一个非常实用的方法，可以帮助我们控制页面的滚动行为。通过合理地运用这个方法，我们可以实现一些炫酷的滚动效果，提升用户体验。希望本文对你有所帮助，谢谢阅读！