本文介绍为何应避免用正则表达式清洗 html 标签，推荐使用原生 domparser 解析并提取 innertext，实现健壮、可维护的纯文本提取方案。

本文介绍为何应避免用正则表达式清洗 html 标签，推荐使用原生 domparser 解析并提取 innertext，实现健壮、可维护的纯文本提取方案。

在前端开发中，常需从 HTML 字符串（如 title 属性值）中提取纯文本内容，剔除

、、 等标签。许多开发者会尝试将多个 .replace() 链式调用“合并为一行”，例如：

text.replace(/]*>.*?/g, '')
    .replace(/@@##@@]*>/g, '')
    .replace(/]*>/g, '');

⚠️ 但这种方法存在严重缺陷：

• 正则无法正确处理嵌套、自闭合、属性含 >、注释或 CDATA 等边界情况；
• 与 之间若含换行或复杂结构，.*? 可能跨标签匹配失败；
• 中的 > 会提前截断匹配，导致解析错误；
• 维护成本高，且无法覆盖未来新增的标签或变体。

✅ 更优解：使用 DOMParser 进行真实 HTML 解析
DOMParser 是浏览器原生 API，能按标准 HTML 规范解析字符串为 DOM 文档，再通过 innerText（或 textContent）安全获取渲染后文本——它天然忽略所有标签、脚本、样式，仅保留用户可见内容，语义准确、鲁棒性强。


html-to-pptx-converter
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
下载

以下为完整实践示例：

// 获取 title 属性值
const titleAttr = $('.text').attr('title');

// 使用 DOMParser 解析 HTML 字符串
const parser = new DOMParser();
const doc = parser.parseFromString(titleAttr, 'text/html');

// 提取纯文本（等价于浏览器渲染后看到的文字）
const cleanText = doc.documentElement.innerText;

console.log(cleanText); // 输出："Lorem Ipsum"

? 关键说明：

• parseFromString(..., 'text/html') 确保以 HTML 模式解析（非 XML），兼容常见 HTML 语法；
• doc.documentElement.innerText 获取 下整个文档的可视文本（等效于 doc.body?.innerText || doc.documentElement.textContent）；
• 若需兼容旧版 IE（已不推荐），可降级为 textContent，但 innerText 更贴近用户实际阅读效果（会忽略 display: none 元素）；
• 此方案自动处理嵌套、属性转义、实体编码（如  ）、空格折叠等，无需手动维护正则逻辑。

? 总结：
不要用正则“修补” HTML —— 它不是正则设计的场景。用 DOMParser + innerText 是语义正确、浏览器原生支持、零依赖、一次写对的工业级方案。尤其在处理动态、不可信或结构多变的 HTML 片段时，这是唯一值得信赖的选择。