最可靠方案是window.scrollTo({top: 0, behavior: 'smooth'})，现代浏览器原生支持；禁用window.scrollTo(0, 0)因会瞬移；fixed按钮失效常因祖先元素含transform等声明；滚动按钮显示需用window.scrollY判断并节流。
直接用 window.scrollTo({ top: 0, behavior: 'smooth' }) 是最可靠、零依赖的方案，比锚点链接更可控，比手写动画更轻量，现代浏览器（Chrome 61+、Firefox 68+、Safari 15.4+）全部原生支持。
为什么不用 window.scrollTo(0, 0)？
这是最常见的错误写法：它会强制“瞬移”到顶部，完全不触发平滑滚动。behavior: 'smooth' 必须通过对象参数传入，不能当位置坐标用。
-
window.scrollTo(0, 0)→ 生硬跳转，无过渡 -
window.scrollTo({ top: 0, behavior: 'smooth' })→ 平滑滚动，体验一致 - 如果页面有 sticky 导航栏，可微调为
{ top: -80, behavior: 'smooth' }，但更推荐用 CSS 的scroll-margin-top统一处理
悬浮按钮固定在右下角却跟着滚动？
不是 JS 问题，是 CSS 层叠上下文作祟。只要任意祖先元素设置了 transform、perspective 或 filter，position: fixed 就会失效。
- 按钮基础样式必须包含：
position: fixed; bottom: 24px; right: 24px; z-index: 100; - 逐级检查父容器是否含
transform: translateZ(0)等声明，有就删掉或改用position: relative模拟 - 移动端需兼容刘海屏：加
padding-bottom: env(safe-area-inset-bottom)防遮挡
点击后没反应，控制台也没报错？
大概率是执行时机不对，或目标不可见。这不是语法错误，而是 DOM 状态或 CSS 隐藏导致的静默失败。
立即学习“前端免费学习笔记（深入）”；
- 别把脚本放在
<head>里直接调用 —— 此时document还没就绪，window.scrollTo会执行但无效 - 绑定点击事件即可，无需等
DOMContentLoaded：按钮本身存在，点击时 DOM 肯定已就绪 - 确保按钮不是
display: none、visibility: hidden，也不是被overflow: hidden的父容器裁掉 - 空链接（
<a href="#">）记得加event.preventDefault()，否则会刷新或跳锚点
怎么让按钮只在滚远了才显示？
靠 window.scrollY 判断，别用 document.body.scrollTop —— 在标准文档模式下它永远是 0。
- 阈值建议设为
300：小于这个值不显示，避免干扰阅读 - 监听
scroll事件时务必节流，尤其在低端 Android 上，否则快速滚动会明显卡顿 - 示例逻辑：
if (window.scrollY > 300) { button.style.opacity = '1'; } else { button.style.opacity = '0'; }
真正容易被忽略的是 scroll-margin-top 和祖先 transform 的组合影响——它们不会报错，也不会警告，只是让一切看起来“不工作”。调试时优先查这两处，比反复改 JS 更有效。
