Javascript正则表达式替换未按预期工作

Question

测试字符串为：

hello hello hello

<span class="self-reference">Tom</span> I don't know <span class="self-reference">Tom</span> I don't think.

我想说的是：

hello hello hello

@Tom I don't know @Tom I don't think.

我使用这个正则表达式：

comment = comment.replace(/\<span class="self-reference"\>(.*)\<\/span\>/gi,"@$1");

但它会输出：

hello hello hello

@Tom</span> I don't know <span class="self-reference">Tom I don't think.

谁能告诉我如何修改它，让它像预期的那样工作？

Answer 1

使用非贪婪正则表达式匹配：

comment = comment.replace(/\<span class="self-reference"\>(.*?)\<\/span\>/gi,"@$1");

如果没有我添加的?，您的正则表达式(.*)将匹配整个字符串，直到它在字符串中找到的最后一个</span>。使用非贪婪操作符*?，您可以在找到匹配时立即停止匹配。

惰性量化

正则表达式中的标准量词是贪婪的，这意味着它们尽可能地匹配。

(source)

Answer 2

另一种可能的解决方案是：

comment = comment.replace(/\<span class="self-reference"\>([^<]+)\<\/span\>/gi,"@$1");

在找到<之前，([^<]+)会捕获所有字符