正则替换HTML标签时如何仅显示1个图标而非多个重复替换结果

根据你的需求可以分两种场景实现，对应代码如下： #

场景1：最终仅输出1个图标 #

只要内容中存在任意HTML标签，统一输出1个📷即可：

const result = /<\/?[^>]+(>|$)/g.test(post.contentHtml()) ? '📷' : post.contentHtml()

场景2：每段连续的标签仅对应1个图标 #

如果需要保留标签之间的文本内容，仅把连续挨在一起的多个标签合并替换为1个图标，调整正则匹配逻辑即可：

// 匹配连续的多个标签整体，替换为单个图标
const result = post.contentHtml().replace(/(?:<\/?[^>]+(?:>|$))+/g, '📷')

原理解释 #

你之前的正则每次只会匹配单个标签，所以<p>、<iframe>、</iframe>、</p>四个标签会被分别替换，生成4个连续的📷。修改后的正则用(?:)+把单个标签的匹配规则包裹，一次性匹配所有连续挨在一起的标签，整体替换为1个图标，不会出现重复的情况。

内容的提问来源于stack exchange，提问作者sama BARI