原生 alert/confirm/prompt 无法加滚动条或样式，必须用自定义弹窗替代；其内容区需设 max-height 和 overflow-y: auto，iOS 需防滚动穿透并缓存/恢复 scrollY。
原生 alert()、confirm()、prompt() 无法加滚动条，也不支持任何样式或内容控制——这是浏览器硬限制，绕不开。 所有“给警告框加滚动条”的需求，必须用自定义弹窗替代。
为什么不能直接改 alert 的滚动行为
原生 JS 对话框是操作系统级模态窗口，DOM 完全不可访问。你无法选中它的文本、无法绑定事件、无法设置 CSS，更别说 overflow 或 max-height。强行在 alert 后加 setTimeout 去操作页面元素，也完全无效。
- 调用
alert('长文本...')时，JS 线程被阻塞，后续代码不执行 - 没有对应的 HTML 元素生成，DevTools 里根本找不到它
- 移动端（尤其是 iOS Safari）还会强制禁用整个页面的 touch 滚动，造成卡死假象
自定义弹窗里内容过长，怎么让内部可滚动
关键不是给弹窗外壳设 overflow，而是给它里面那个装文本的容器设 max-height 和 overflow-y: auto。常见错误是把样式直接写在 .modal 或 .dialog 上，结果滚不起来。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 确保弹窗内容区是独立
<div class="dialog-content"></div>，不是直接塞进<div class="modal"> <li>给 <code>.dialog-content设max-height: 60vh（不能写100%或auto） - 必须加
overflow-y: auto，scroll会始终显示滚动条，体验差 - 如果外层是
display: flex，这个内容容器还得加min-height: 0，否则 flex 会撑高导致溢出失效 - 移动端加
touch-action: pan-y，iOS Safari 才能响应纵向滑动 - 弹窗打开时，立刻执行：
document.body.style.overflow = 'hidden';并缓存window.scrollY - 关闭时还原：
window.scrollTo(0, savedScrollY)，别只靠body.style.overflow = '' - 不要在遮罩层（overlay）上全局绑
touchmove.preventDefault()，否则弹窗内自己的滚动也会被封死 - 监听滚动事件或调用
scrollTo()，目标必须是那个.dialog-content元素，不是window或弹窗外壳 - 检查是否到底部：用
container.scrollTop >= container.scrollHeight - container.clientHeight - 0.5，小数边界防 subpixel 计算误差
防 iOS 穿透和滚动位置丢失的实操要点
即使 CSS 写对了，在 iOS Safari 真机上仍可能一滑就滚底层页面，或者关闭后页面跳回顶部。这不是 bug，是它的滚动上下文机制决定的。
立即学习“前端免费学习笔记（深入）”；
最易被忽略的一点：滚动容器必须在 DOM 渲染完成后再操作 scrollTop。哪怕你用了 setTimeout，也建议包一层 requestAnimationFrame，否则在某些框架（如 React 18 concurrent 模式）下会读到旧的 scrollHeight 值。
