浏览器标签页无响应时，应先通过内置任务管理器（Chrome/Edge按Shift+Esc，Firefox输入about:performance）定位CPU、内存或网络瓶颈；本地双击HTML无反应多因file://协议限制，需用本地服务器验证；交互失灵优先检查pointer-events和z-index；DevTools修改HTML无效往往是JS抢改或CSS隐藏所致。
浏览器标签页无响应，先看任务管理器里谁在卡死
HTML 页面“停止运行”或长时间白屏，大概率不是代码逻辑错，而是某个进程把主线程锁死了。别急着改 JS，先打开浏览器内置任务管理器确认真实瓶颈。
Chrome / Edge 按 Shift + Esc，Firefox 在地址栏输入 about:performance —— 这里能看到每个标签页的 CPU、内存、网络占用。重点盯三项：
-
CPU持续 >90%：说明有长任务（比如while(true)、未节流的resize监听器、或大量同步 DOM 操作）正在阻塞渲染 -
Memory占用缓慢上涨不释放：可能是事件监听器没解绑、闭包持有大对象、或localStorage存了超大字符串（Chrome 限制约 10MB） - 某标签页显示
Unresponsive或Waiting for network：说明卡在 fetch、WebSocket 连接或跨域资源加载上，不是 HTML 本身问题
本地双击打开 HTML 无反应？file:// 协议是元凶
双击 index.html 后浏览器没启动、窗口一闪而过、或白屏不报错——90% 是 file:// 协议限制导致，不是你代码写错了。
Chromium 内核（Chrome/Edge）对本地文件路径极其敏感：
立即学习“前端免费学习笔记（深入）”；
- 路径含中文、空格、
#、%会静默失败（例如C:\我的项目\demo v2\index.html） -
fetch()、localStorage（部分版本）、@importCSS 规则全被同源策略拦截 -
Network面板在file://下基本不可用，查不到404或加载瀑布流
立刻验证：终端执行 npx serve -s .（需 Node.js）或 python3 -m http.server 8000，然后访问 http://localhost:8000。如果一切正常，就坐实是协议问题。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
按钮/交互元素显示正常但点不动？先查 pointer-events 和 z-index
HTML 元素渲染出来了，鼠标悬停没变化、点击无回调，不是 JS 没绑好，而是它根本收不到事件。
在 Elements 面板选中该按钮，在 Styles 面板顶部快速扫三行：
- 检查
pointer-events是否为none（父元素设了也会继承） - 看
z-index值是否被其他position: relative/absolute/fixed元素覆盖（哪怕覆盖层透明，也会挡事件） - 确认没有
opacity: 0或visibility: hidden—— 这俩不影响事件捕获，但display: none会让元素彻底退出事件流
临时验证：在 Styles 面板里手动删掉可疑样式，或加一行 pointer-events: auto !important; 看是否恢复响应。
DevTools 里改完 HTML 没生效？不是工具坏了，是它被抢改了
你在 Elements 面板双击改了 <button>提交</button>，回车后文字没变——这不是 DevTools 失效，而是你的修改瞬间被更高优先级逻辑覆盖了。
立刻切到 Console 面板，输 console.dir($0)（$0 是当前选中元素），看 innerText 或 innerHTML 的实时值。再搜这几类干扰源：
- CSS 隐藏：
display: none、visibility: hidden、opacity: 0、负z-index—— 在 Styles 面板逐个点掉禁用，看是否“突然出现” - JS 抢改：页面是否有定时器、
MutationObserver、或框架响应式逻辑（如 Vue 的v-model）在持续重写该节点内容 - Shadow DOM 隔离：右键检查到的按钮如果是自定义组件（如
<video></video>内部控件），得点 Elements 右上角⋮ → Show user agent shadow DOM才能看到真实可编辑结构
所有在 Elements 面板做的修改都只存在于当前会话，刷新即丢。想持久生效，必须改源码或构建流程，而不是依赖 DevTools 编辑。
