富文本转text的问题

cqwcns

通过富文本编辑器，用户可以编辑文章，生产html代码保存到数据库。
当前端需要显示文章时，我们可以用rich-text渲染富文本。
但在显示文章列表中预留文章时，我们不希望显示HTML样式，只希望显示文本。


网上查了一下，一般可以用正则替换掉HTML标签：

[JavaScript] 纯文本查看 复制代码

element.contentText = element.content.replace(/<[^>]*>/g, '')

问题在于这种正则没有保留换行，导致文章的段落层次都没有了，我希望保留换行。我尝试这样：

[JavaScript] 纯文本查看 复制代码

element.contentText = element.content.replace(/</[^>]*>/g, '\r')
        element.contentText = element.content.replace(/<[^>]*>/g, '')

但这样写是报错的。
请各位大佬指教，谢谢。

yingsummery

学习了，感谢楼主

Todd

[JavaScript] 纯文本查看 复制代码

"12<a></a>3".replace(/<\/[^>]*>/g, '\r').replace(/<[^>]*>/g, '')

看看是不是你要的结果

cqwcns

Todd 发表于 2021-10-29 16:41
看看是 ...

谢谢，可行，但我这边用\n才行，\r没有换行效果。

知心

编辑器保存的时候是由p标签的。你用p标签分个组，然后再拆

cqwcns

Todd 发表于 2021-10-29 16:41
看看是 ...

为避免出现空行（连续多个\n），我进一步改了一下，加了一个/\n{2,}/替换为\n。


.replace(/<\/[^>]*>/g, '\n').replace(/<[^>]*>/g, '').replace(/\n{2,}/g, '\n');