首页 前端知识 Javascript | 3种 HTML 转换为纯文本的方法

Javascript | 3种 HTML 转换为纯文本的方法

2024-05-19 09:05:47 前端知识 前端哥 123 539 我要收藏

前几天,我手里的一个项目需要将富文本的所有 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

使用:

转载请注明出处或者链接地址:https://www.qianduange.cn//article/8876.html
标签
评论
会员中心 联系我 留言建议 回顶部
复制成功!