js：scroll平滑滚动页面或元素到顶部或底部的方案汇总

准备知识：

• scrollWidth: 是元素全部内容的宽度，包括由于overflow溢出而在屏幕上不可见的内容
• scrollHeight: 是元素全部内容的高度，包括由于overflow溢出而在屏幕上不可见的内容
• scrollTop: 纵向滚动条距离元素最顶部的距离
• scrollLeft: 横向滚动条距离元素最左侧的距离

1、CSS的scroll-behavior

语法

scroll-behavior: auto | smooth | inherit | unset

参数
- smooth：表示滚动很平滑，有过渡效果
- auto：没有过渡效果，一闪而过。

关键代码

html, body {
   
  scroll-behavior