局部滚动需容器高度锁定且内容溢出，否则scrollTop恒为0；scroll-behavior: smooth仅对目标容器生效，且受系统偏好和Safari版本限制；操作时须校验目标存在性并用getBoundingClientRect计算偏移。
局部滚动不是加个 overflow: auto 就能用，绝大多数失效问题都出在容器高度没真正“锁住”或滚动上下文被意外截断。
为什么 scrollTop 总是 0？
这是最常被忽略的硬性前提：局部滚动容器必须同时满足三个条件——有明确的 height 或 max-height（不能是 min-height 或靠内容撑开）、overflow-y 值为 auto/scroll、内部内容总高度确实超过容器可视区域。任意一条不满足，scrollTop 就恒为 0。
-
flex子项未加flex-shrink: 0，父容器高度计算异常，导致子容器被压缩到无高度 - 父级用了
transform、perspective或filter，会创建新层叠上下文，使offsetTop失准 - 子元素用了
display: contents或visibility: hidden，滚动高度计算被干扰 - 移动端 Safari 在某些嵌套下对
height: 100%解析不稳定，建议改用vh单位
scroll-behavior: smooth 不生效的常见原因
它只对「当前可滚动元素自身」起作用，且依赖浏览器原生支持。设在 html 上影响整页，设在 body 上多数无效（因实际滚动容器是 documentElement）。
- 必须直接加在目标容器上：
.list-container { scroll-behavior: smooth; } - 仅对
scrollTo()、scrollIntoView()和锚点跳转生效；手动赋值scrollTop = 100不触发平滑 - Safari 15.4 之前版本在局部容器中
scrollIntoView({ behavior: 'smooth' })会静默降级为瞬跳 - 用户开启系统级「减少运动」偏好（
prefers-reduced-motion: reduce）时，该属性自动禁用——这是正确行为，不应绕过
用 JS 控制局部滚动位置时的关键校验
别直接调 element.scrollIntoView()，它默认滚根视口。要精准控制局部容器，必须显式操作容器本身，并验证目标是否真在其中。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
立即学习“前端免费学习笔记（深入）”；
- 先检查：
if (!container.contains(target)) return;，防止目标不在该容器内却强行滚动 - 计算偏移推荐用
target.getBoundingClientRect().top - container.getBoundingClientRect().top + container.scrollTop，比target.offsetTop - container.offsetTop更健壮 - 调用：
container.scrollTo({ top: targetTop, behavior: 'smooth' })，不要混用scrollTop = 0+behavior - 若需兼容旧 Safari，降级写法：
container.scrollTo(0, targetTop)（同步跳转，无动画）
按钮驱动上下滚动的边界处理
用 scrollBy() 实现“点一下滚一段”最稳，但边界判断不能只看整数。
- 向上禁用逻辑应写成：
container.scrollTop ，向下禁用写成：<code>container.scrollTop > container.scrollHeight - container.clientHeight - 0.5 - 高 DPI 屏、页面缩放、iframe 嵌套都会让
scrollTop变成小数，仅用=== 0或=== max判断必误判 - 按钮状态更新建议节流，比如用
setTimeout(..., 100)，避免滚动中高频重绘 - 避免在
scroll事件里读取scrollTop——每次读都会强制 layout，长列表极易卡顿；改用IntersectionObserver监听视口进出
真正容易被忽略的是：局部滚动不是独立功能，它和父级布局、CSS 层叠上下文、系统偏好设置深度耦合。一个 transform、一行 contain: paint、甚至用户开了“减少动画”，都可能让整个滚动链路静默失效。
