javascript - 正则表达式 : How to replace the matched text with a HTML element in JavaScript?

Question

这个问题已经有答案了:

JS to automatically convert text in parentheses with specific markup including match (3 个回答)

JavaScript/jQuery String Replace With Regex (4 个回答)

已关闭 4 年前。

我有一个来自数据库的描述，如下所示:

"And here is the {{dog}} which is chasing the {{cat}}"

而不是 {{dog}}我想将其替换为 <span class="dog"/>

我试过这个:My Attempt

我知道如何提取，但我不知道如何仅更换这些部件，然后进行显示。

谢谢你!

编辑:

var input = "And here is the {{dog}} which is chasing the {{cat}}";
var regex = /{{(.*?)}}/g;

var matches, output = [];
while (matches = regex.exec(input)) {
    output.push(matches[1]);

}

我希望我的最终字符串是: And here is the <span class="dog"/> which is chasing the <span class='cat'/>

Answer 1

您可以使用这样的捕获组:

$1 表示括号内匹配的文本(捕获组)，可用于replace ( MDN )

const str = "And here is the {{dog}} which is chasing the {{cat}}"
const newStr = str.replace(/{{(\w+)}}/g, "<span class='$1' />")

console.log(newStr)