JavaScript 实现字符串全局替换:正则表达式与自定义函数详解

作者:函数茶馆

时间:2026-10-25

浏览:621

本文介绍JavaScript中字符串替换的两种实现方式。首先对比String.replace()默认行为与使用正则表达式加g标志的全局替换效果,展示如何一次性替换所有匹配项。其次提供扩展String原型实现replaceAll的方法,通过正则转义特殊字符支持包含符号的文本替换,并附带完整的HTML交互示例。

文章目录

JavaScript 实现字符串全局替换:正则表达式与自定义函数详解

alert("abacacf".replace('a','9'));


alert("abacacf".replace(/a/g,'9'));


首次运行输出结果为 9bacaf,仅替换首个匹配项


第二次运行输出结果为 9b9c9f,实现了全局替换


利用正则表达式中的 g 标志(global)实现全局替换



补充:包含特殊字符的全局替换方法


具体代码实现如下:

 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script language="javascript" type="text/javascript">
String.prototype.replaceAll = stringReplaceAll;
function stringReplaceAll(AFindText,ARepText){
var raRegExp = new RegExp(AFindText.replace(/([\(\)\[\]\{\}\^\$\+\-\*\?\.\"\'\|\/\\])/g,"\\$1"),"ig");
return this.replace(raRegExp,ARepText);
} 
function myreplace(){
var content=document.getElementById("content").value;
var rel_con=content.replaceAll("$name","wwww");
document.getElementById("content2").value=rel_con;
} 
</script>
</HEAD>
<BODY>
<input type="text" id="content" name="contxt" value="$name 客户姓名" />&nbsp;&nbsp;<input type="button" value="replace"
onclick="myreplace()"/><br/>
<input type="text" id="content2" value=""/>
</BODY>
</HTML>

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章