最稳路径是用querySelector定位元素后取textContent；它稳定、不受CSS影响、纯文本提取，避免innerText（受样式干扰、可能重排）和innerHTML（含标签需二次处理），动态内容需等渲染完成，Shadow DOM需访问shadowRoot，服务端用cheerio模拟。
直接用 querySelector 定位 + textContent 提取，是最稳的路径；别碰正则解析 HTML 字符串，也别依赖 innerText——它受样式干扰，还可能触发重排。
用 querySelector 提取动态渲染后的文本最可靠
页面加载后、AJAX 或 JS 插入的内容已挂载到 DOM，此时必须等渲染完成再操作。常见错误是脚本执行太早，querySelector 返回 null。
- 确保在
DOMContentLoaded或数据插入完成后的回调里执行，比如fetch().then(() => { const el = document.querySelector('#workspace-body'); console.log(el?.textContent); }) - 若目标在 Shadow DOM 内，需先访问
shadowRoot：host.shadowRoot.querySelector('.item').textContent - 服务端预渲染或 SSR 场景下，浏览器还没接管时，
textContent可能为空——这时要加个requestIdleCallback或简单轮询检测元素是否存在
innerText 和 textContent 差在哪？为什么推荐后者
innerText 返回“用户可见文本”，但会跳过 display: none、visibility: hidden 元素，还会受字体、换行、CSS 白空间处理影响；textContent 是纯 DOM 树遍历，只读文本节点内容，不触发布局计算。
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 遇到隐藏区域也要提取（比如折叠面板的原始内容），必须用
textContent -
innerText在某些旧版 Safari 中对换行处理不一致，textContent行为统一 - 性能上，
textContent几乎无开销；innerText可能强制触发重排（layout thrashing）
局部刷新后怎么继续取新内容？别让事件和文本一起丢
用 innerHTML = htmlString 替换内容后，原绑定的事件监听器全失效，textContent 也得重新查——这不是 bug，是浏览器规范行为。
立即学习“前端免费学习笔记（深入）”；
- 优先用
replaceChildren()：它保留父节点，不销毁子树，事件监听器可保留在父级（配合事件委托） - 如果兼容性要求高（IE 或老 Android WebView），fallback 到
innerHTML后，必须重新绑定事件，或统一用事件委托挂到容器上：container.addEventListener('click', e => { if (e.target.matches('.save-btn')) { /* 处理 */ } }) - Handlebars / Mustache 渲染后注入，务必确认返回的是合法 HTML 片段——比如往
<tbody> 里塞 <code><tr> 没问题，但塞 <code><div> 会被浏览器自动包裹、错乱结构<p>真正容易被忽略的是：动态内容是否已真实挂载。很多“取不到”不是选择器写错，而是你查得太早——DOM 更新是异步的，哪怕只是 <code>el.innerHTML = str，后续读textContent也得等 microtask 完成。加个await Promise.resolve()或queueMicrotask就能避开一半坑。
