javascript - 如何用js替换html中特定属性中的括号？

Question

我有这个 html 代码:

<div>
    <a href="TOTO/{{CODE}}/TOTO/{{CLICK}}/{{OPEN}}" data-href="TOTO/{{CODE}}/TOTO/{{CLICK}}/{{OPEN}}">FOO1</a>
</div>
<div>
    <a href="{{CODE}}/{{CLICK}}/BAR" data-href="{{CODE}}/{{CLICK}}/BAR">FOO2</a>
</div>

我想将 {{CODE}} 更改为 %%CODE%%，将 {{CLICK}} 更改为 %%CLICK%%，将 {{OPEN}} 更改为 %%OPEN%%，但仅限于属性所有 div 中的 data-href。

我不知道如何只定位 data-href。 我尝试将此定位到 data-href 属性中的括号:

/data-href="([^"]+)({{([^\"]*)}}+)([^"]+)"/g

但它不起作用!

感谢您的帮助。

Answer 1

您可以使用一个简单的正则表达式来匹配 data-href 中的任何内容。一个简单的正则表达式可以是这样的

data-href=".*?"

然后，您可以用一个循环替换所有匹配项

var str = '<div><a href="TOTO/{{CODE}}/TOTO/{{CLICK}}/{{OPEN}}" data-href="TOTO/{{CODE}}/TOTO/{{CLICK}}/{{OPEN}}">FOO1</a></div><div><a href="{{CODE}}/{{CLICK}}/BAR" data-href="{{CODE}}/{{CLICK}}/BAR">FOO2</a></div>';
var myRegexp = /data-href=".*?"/g;
var match = myRegexp.exec(str);
while (match != null) {
  str = str.replace(match[0], match[0].replace(/{{|}}/g, '%%'));
  match = myRegexp.exec(str);
}
console.log(str)