本文介绍一种比正则替换更可靠、更健壮的方案：使用 domparser 解析 html 字符串并提取 innertext，彻底避免正则处理嵌套标签、转义字符或边界情况导致的错误。

本文介绍一种比正则替换更可靠、更健壮的方案：使用 domparser 解析 html 字符串并提取 innertext，彻底避免正则处理嵌套标签、转义字符或边界情况导致的错误。

在前端开发中，常需从 HTML 片段（如 title 属性值）中提取纯文本内容。初学者容易想到用链式 .replace() 配合多个正则表达式移除

、、 等标签，例如：

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

但这种写法存在严重隐患：
✅ 无法正确处理嵌套结构（如

hello

中的 可能被误匹配）；
❌ 对自闭合标签、属性含 >（如 alt="A > B"）、注释、CDATA 或 HTML 实体（如  ）完全无感；
❌ 正则贪婪/非贪婪模式易出错，维护成本高，且无法保证跨浏览器一致性。

推荐方案：用标准 Web API —— DOMParser
它将字符串安全解析为真实的 DOM 树，再通过 innerText（或 textContent）获取渲染级/语义级纯文本，天然规避所有 HTML 结构复杂性：

function extractPlainText(htmlString) {
  const parser = new DOMParser();
  const doc = parser.parseFromString(htmlString, 'text/html');
  return doc.documentElement.innerText || doc.body.innerText || '';
}

// 应用于你的场景：
const title = $('.text').attr('title');
const cleanText = extractPlainText(title);
console.log(cleanText); // 输出："Lorem Ipsum"

⚠️ 注意事项：

Html2md

使用 Readability + Turndown 将 HTML 页面转换为干净的、Agent 友好的 Markdown。去除导航栏、广告、页脚、Cookie 横幅、社交按钮等干扰元素。支持 URL...

下载

• DOMParser 在所有现代浏览器（包括 IE10+）中均原生支持，无需额外依赖；
• 若输入为空字符串或非法 HTML，parseFromString 仍会返回有效文档对象，innerText 安全返回空字符串；
• 如需保留换行/空格格式，可用 textContent 替代 innerText（后者受 CSS 影响）；
• jQuery 非必需——纯 JS 即可完成：document.querySelector('.text').getAttribute('title')。

总结：永远不要用正则解析 HTML。面对 title、data-* 属性等内嵌 HTML 片段，DOMParser 是简洁、标准、可维护的首选方案。它让代码从“侥幸工作”升级为“必然正确”。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！