【JS新手教程】replace替换一个字符串中全部的某单词

2021年09月15日 阅读数:2
这篇文章主要向大家介绍【JS新手教程】replace替换一个字符串中全部的某单词,主要内容包括基础应用、实用技巧、原理机制等方面,希望对大家有所帮助。

JS中的replace方法能够替换一个字符串中的单词。
语句的格式是: 须要改的字符串.replace(字符串或正则表达式,替换成的字符串)javascript

若是第一个参数用字符串,默认是找到该字符串中的第一个匹配的字符串进行替换,剩下的不会替换。
若是是只想替换第一个匹配的内容,能够用字符串或者正则表达式均可以,效果同样,正则表达式的写法是,用斜杠包裹须要替换的内容。java

若是想要替换整个字符串中全部的地方,正则表达式加g,g表明全局,全部的地方都会替换
若是想要替换整个字符串中全部地方,且不区分大小写,加ig,i表明不区分大小写,g是全局正则表达式

因为英文是字母组成的,有的字母很长,里面包含须要替换的字母组合,就会形成错误替换,以下面例子的he,可是the,them等单词里 都包含he这两个字母组合,就会形成错误替换,正则表达式里加一对反斜杠b包裹须要的字母组合,就会忽略先后有字母的其余单词,英文中单个单词先后通常是空格或标点符号,用这个能够找单词。app

正则表达式:用斜杠包裹所须要的内容和一些规则。
加g:全局,替换全部匹配的内容
加i:忽略大小写,替换全部忽略大小写后的匹配的内容
加ig:忽略大小写,且全局,替换全部匹配的内容
用/b内容/b,用反斜杠b包裹:找单词,去掉字母组合先后有其余单词的内容。ide

测试代码:结果在图示里。测试

window.onload=function(){
var stoy1=" them HE he the he He";
//两边有字母也算
//只替换第一个he
stoyRe1=stoy1.replace("he","she");//(字符串)
stoyRe2=stoy1.replace(/he/,"she");//(正则表达式)
//替换所有的he
stoyRe4=stoy1.replace(/he/g,"she");//替换字符串所有的he
stoyRe6=stoy1.replace(/he/ig,"she");//忽略大小写的,替换所有的he

//两边有字母不算,找到单词
stoyRe3=stoy1.replace(/\bhe\b/,"she");//替换找到的第一个he,找单词
stoyRe5=stoy1.replace(/\bhe\b/g,"she");//替换所有的he,找单词
stoyRe7=stoy1.replace(/\bhe\b/ig,"she");//i忽略大小写,全局,找单词

document.write("原字符串:"+stoy1+
"<br>\"he\"结果:"+stoyRe1+      //----"he" 
"<br>/he/结果:"+stoyRe2+       //----/he/
"<br>/he/g结果:"+stoyRe4+   //----/he/g
"<br>/he/ig结果:"+stoyRe6+  //---/he/ig
"<br>/\\bhe\\b/结果:"+stoyRe3+  //-----/\bhe\b/
"<br>/\\bhe\\b/g结果:"+stoyRe5+  //-----/\bhe\b/g
"<br>/\\bhe\\b/ig结果:"+stoyRe7);     //-----/\bhe\b/ig 
}

图示:spa

 

以下,作了个测试例子,是在文本框中输入一段内容,而后替换里面的部分单词,再从新赋值给文本框。
在百度上搜了一篇小英文故事,是男第三人称描述的,用替换内容的方法,替换成了女第三人称,能够点击连接一键转换,比人工查找替换要快捷。
测试用的小故事放到JS的注释里了,复制到文本框里,点击连接可转换。
前面的测试后面的变量没有加var,这里是直接对一个字符串进行屡次替换,而后再把变量赋值给原来的文本框。
这里面有点小问题,故事里第三人称的不仅是猴子,还有大象,大象也用第三人称描述,因此也被替换成了女的第三人称,这个是没法区分的,具体he指代的是猴子仍是大象,程序没法区分,只是把全部的he给替换掉了
测试代码:
图示:code

替换:
he----she
He----He
his---her
him---herblog

测试代码:three

<body>
 输入男第三人称的故事:<br>
 <textarea id="t2" cols=100 rows=10></textarea>
 <br>
 <a href="javascript:Re()">点击转成女第三人称</a>
<script>
function Re(){
var stoy1=document.getElementById("t2").value;
stoy1=stoy1.replace(/\bhe\b/g,"she");
stoy1=stoy1.replace(/\bHe\b/g,"She");
stoy1=stoy1.replace(/\bhis\b/g,"her");
stoy1=stoy1.replace(/\bhim\b/g,"her");
document.getElementById("t2").value=stoy1;
}
//"One day, a monkey rides his bike near the river. This time he sees a lion under a tree. The lion runs at him. He is afraid and falls into the river. He can’t swim. He shouts. The rabbit hears him. He jumps into the river. The rabbit swims to the monkey, but he can’t help him. Luckily, an elephant comes along. He is very strong. He helps the rabbit and monkey. Three friends are very happy. They go to the elephant’s home. Then, three of them become good friends."
</script>
 </body>

图示:这个程序替换,没法详细区分单词代指的是哪一个动物,只是把全部单词替换了。只是作了个例子。