最推荐使用 window.scrollTo({ top: 0, behavior: 'smooth' }) 实现平滑返回顶部，需显式传参、加节流、兼容 fallback；CSS scroll-behavior: smooth 仅作用于 html 元素且控制粒度粗；按钮显隐宜用 IntersectionObserver 而非 scroll 监听；定位需适配安全区、缩放与横向滚动。
用 window.scrollTo() 实现平滑返回顶部
现代浏览器中，最直接、可控性最强的方式就是调用 window.scrollTo() 并传入 { top: 0, behavior: 'smooth' }。它不依赖 CSS，也不污染 URL，适合绝大多数单页应用（SPA）场景。
常见错误是直接写 window.scrollTo(0, 0) —— 这会瞬间跳顶，毫无动画；或者漏掉 behavior 参数，导致 Safari 15.4 以下或部分安卓 WebView 中降级为硬跳。
- 必须显式传参：
window.scrollTo({ top: 0, behavior: 'smooth' })，不能只传坐标 - 建议加节流：连续点击时避免重复触发滚动，可用
!isScrolling标记控制 - 兼容 fallback：可先检测
'scrollBehavior' in document.documentElement.style，不支持时改用scrollIntoView()或降级为auto - 注意：在 iframe 内调用时，需确保同源，否则抛
SecurityError
用 html { scroll-behavior: smooth } 开启全局锚点平滑
这个 CSS 规则能让所有原生锚点跳转（比如 <a href="#top"></a>）自动带滚动动画，代码量最少，但控制粒度粗。
容易踩的坑是把它写在 body 上——无效，必须作用于 html 元素；另外，一旦开启，所有 scrollIntoView() 调用也会继承该行为，可能和 JS 逻辑冲突。
立即学习“前端免费学习笔记（深入）”；
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 只对
<a href="#xxx"></a>和element.scrollIntoView()生效，window.scrollTo()默认不响应 - IE 完全不支持；Safari 需 15.4+；老安卓 WebView 表现不稳定
- 若页面用了
transform或perspective创建新层叠上下文，可能意外禁用 smooth 效果 - 不推荐在大型管理后台开启，因为路由哈希变化频繁，动画反而干扰操作节奏
按钮显隐逻辑别靠 window.onscroll 轮询
监听滚动来控制「返回顶部」按钮是否显示，很多人习惯写 window.addEventListener('scroll', () => { ... }) 并在内部读取 window.scrollY，但这在长列表或高频滚动下容易卡顿。
真正轻量且精准的做法是用 IntersectionObserver 监听一个占位元素（比如 <div id="top-anchor"></div>）是否离开视口，或者监听 document.body 的滚动边界。
- 轮询
scrollY每次触发都强制重排，尤其在低端 Android 设备上明显掉帧 -
IntersectionObserver是异步、低优先级的，不阻塞主线程，且天然防抖 - 示例：观察一个高度为 1px、固定在顶部的
<div id="trigger-top"></div>，当它不可见时显示按钮 - 不要监听
document.documentElement—— 在某些 iOS Safari 版本中它的getBoundingClientRect()返回值异常
定位按钮时避开安全区域与缩放偏移
固定定位按钮（position: fixed）在 iPhone X+ 或折叠屏设备上常被底部安全区遮挡，而用户缩放页面后，transform: translate() 居中又会导致热区错位。
关键不是“怎么居中”，而是“怎么让点击区域始终准确”。真实项目里，按钮位置必须同时适配安全区、缩放、横向滚动三个变量。
- 用
bottom: calc(1rem + env(safe-area-inset-bottom))，并确保env()外有 fallback（如calc(1rem + 0px)） - 绝对避免
transform: translate(-50%, -50%)做居中——DPR > 2 或 zoom ≠ 100% 时，getBoundingClientRect()返回的 clientX/clientY 会失准 - 右侧定位慎用
right: 0：页面存在横向滚动时，按钮会被拖出可视区，应改用right: 1rem+margin-right: 1rem - 按钮尺寸别小于 44×44px（iOS 最小触控区），否则在 Safari 中点击反馈弱、易误操作
hashchange，可能意外重载路由守卫或清空表单状态。这时候，window.scrollTo() + behavior: 'smooth' 就不只是“更丝滑”，而是唯一能绕过哈希变更的可靠路径。 
