前几天,我手里的一个项目需要将富文本的所有 html 标签转换成纯文本展示在列表详情字段,由于富文本可以编辑一些视频图片等乱七八遭的样式,所以产品提出在列表展示详情的时候需要只提取html纯文本!
1. 使用 .replace(/<[^>]*>/g, '')
这个方法是从文本中去除 html 标签最简单的方法。它使用字符串的方法 .replace(待替换的字符串,替换后的字符串) 将 HTML 标签替换成空值。 /g 是表示替换字符串所有匹配的值,即字符串中所有符合条件的字符都将被替换。
这个方法的缺点是有些 HTML 标签不能被剔除,不过它依然很好用。
2. 创建临时DOM元素并获取其中的文本
这种方法是完成该问题的最有效的方法。创建一个临时 DOM 并给他赋值,然后我们使用 DOM 对象方法提取文本。
3. 使用 html-to-text npm 包
html-to-text 这个包的功能很全了,转换也有许多的选项比如:wordwrap, tags, whitespaceCharacters , formatters 等等。
安装:
npm install html-to-text
使用: