如何让JavaScript Replace函数一次性替换所有匹配的字符串？

嘿，这个问题我之前也碰到过！你现在遇到的情况是因为JavaScript的String.replace()方法有两种用法：当你用普通字符串作为匹配目标时，它默认只会替换第一个找到的匹配内容，这就是为啥你点一次按钮只能换掉一个"Microsoft"，得点两次才能全换掉。

解决方案：使用全局正则表达式 #

要一次性替换所有匹配项，你需要把匹配目标改成带全局标志g的正则表达式，而不是普通字符串。具体来说，把原来的"Microsoft"换成/Microsoft/g就可以了。

修改后的代码 #

先看修改后的函数：

function myFunction() {
  var str = document.getElementById("demo").innerHTML;
  // 这里把字符串替换成带g标志的正则
  var res = str.replace(/Microsoft/g, "W3Schools");
  document.getElementById("demo").innerHTML = res;
}

完整的代码示例：

<p id="demo">Visit Microsoft! Visit Microsoft!</p>
<button onclick="myFunction()">Try it</button>

<script>
function myFunction() {
  var str = document.getElementById("demo").innerHTML;
  var res = str.replace(/Microsoft/g, "W3Schools");
  document.getElementById("demo").innerHTML = res;
}
</script>

补充说明 #

• 正则表达式里的g是全局匹配的意思，告诉replace方法要替换所有匹配到的内容，而不是只替换第一个。
• 如果你的场景需要忽略大小写（比如匹配"microsoft"、"Microsoft"都要替换），可以再加一个i标志，写成/Microsoft/gi。

这样修改后，点一次"Try it"按钮就能把所有的"Microsoft"都替换成"W3Schools"啦！

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