JQ-如何利用replace实现replaceAll方法

旺仔流奶啊~

已于 2023-12-12 23:29:15 修改

阅读量1.1k

点赞数

分类专栏：前端相关技术文章文章标签： jquery

于 2020-11-15 23:59:51 首次发布

本文链接：https://blog.csdn.net/qq_40393739/article/details/109712374

版权

前端相关技术文章专栏收录该内容

5 篇文章

订阅专栏

本文通过示例代码展示了JavaScript中如何利用replace方法实现replaceAll功能，特别是针对特殊字符的替换。文中提到，由于JS原生不支持replaceAll，因此需要自定义方法。在测试过程中，发现直接使用replace无法替换特殊字符，如'^'，而通过正则表达式可以解决此问题。最终给出的解决方案是使用正则匹配特殊字符并进行替换，从而达到替换所有目标字符的效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

JQ-如何利用replace实现replaceAll方法

本文主要解决的是特殊字符replaceAll的实现
- 问题1：由于JS没有自带replaceAll方法，所以如果我们在前端页面如果需要替换字符串中所有的某个字符时，需要对自带的replace方法进行改进。网上的普遍方法（测试1，2，3）：
- 问题2：以上方法存在一个缺陷，测试3的时候对特殊字符没有办法替换。需要使用被替换字符需要使用正则方式书写，如测试4：

本文主要解决的是特殊字符replaceAll的实现

问题1：由于JS没有自带replaceAll方法，所以如果我们在前端页面如果需要替换字符串中所有的某个字符时，需要对自带的replace方法进行改进。网上的普遍方法（测试1，2，3）：

		形如：str1.replace(new RegExp('z', "gm"), '@');

问题2：以上方法存在一个缺陷，测试3的时候对特殊字符没有办法替换。需要使用被替换字符需要使用正则方式书写，如测试4：

		var reg = /\^/g;
		msg = $("#oldMsg").text().replace(new RegExp(reg, "gm"), '@');

完整测试代码如下.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		<p id="oldMsg">1224^zzz^ssssssss^pkkpkop</p>
		<p id="newMsg"></p>
		<input type="button" onclick="exchangeChar();" value="替换" />
	</body>
	
	<script type="text/javascript" src="js/jquery.min.js" ></script>
	<script>
		function exchangeChar() {
			// 网上普遍说的方法如：str1.replace(new RegExp('z', "gm"), '@');
			var msg = $("#oldMsg").text();
			
			// 测试1：替换字母z为@，结果，成功：1224^@@@^ssssssss^pkkpkop
			//	结论1：对字母替换有效
//			msg = msg.replace(new RegExp('z', "gm"), '@');
			
			// 测试2：替换数字2为@，结果，成功：1@@4^zzz^ssssssss^pkkpkop
			//	结论2：对数字替换有效
//			msg = msg.replace(new RegExp('2', "gm"), '@');
			
			// 测试3：替换特殊符号^为@，结果，失败：@1224^zzz^ssssssss^pkkpkop
			//	结论3：对特殊符号替换无效
//			msg = msg.replace(new RegExp('^', "gm"), '@');

			// 测试4：替换特殊符号^为@，结果，成功：1224@zzz@ssssssss@pkkpkop
			//	结论4：对特殊符号替换有效
			var reg = /\^/g;
			msg = $("#oldMsg").text().replace(new RegExp(reg, "gm"), '@');

			$("#newMsg").html(msg);
		}
	</script>
</html>