replace()
JS 字符串有replace() 方法。但这个方法只对匹配到的第一个字符串替换。如果要全部替换的话,JS 没有提供replaceAll() 这样的方法
stringObject.replace(regexp|substr, newSubStr|function)
两个参数都是必需项,用newSubStr|function
替换stringObject
中第一个符合regexp|substr
条件的字串,返回一个新字符串,原字符串不变。
JS replace() 实现全部替换
① 使用正则表达式
console.log("zzzzzz".replace("z","r")); //rzzzzz
console.log("zzzzzz".replace(/z/g,"r")); //rrrrrr
//等价于
console.log("zzzzzz".replace(new RegExp("z","gm"),"r")); //rrrrrr
g 执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)
m 执行多行匹配
在使用正则表达式时,特殊字符需要转义
② 添加 Stirng对象的原型方法
<script>
function f(){
String.prototype.replaceAll = function(oldStr,newStr){
return this.replace(new RegExp(oldStr,"gm"),newStr);
}
console.log("zzzzzz".replaceAll("z","r")); //rrrrrr
}
</script>
String.prototype.replaceAll = function(reallyDo, replaceWith, ignoreCase) {
if (!RegExp.prototype.isPrototypeOf(reallyDo)) {
return this.replace(new RegExp(reallyDo, (ignoreCase ? "gi": "g")), replaceWith);
} else {
return this.replace(reallyDo, replaceWith);
}
}
//reallyDo 不是正则,RegExp.prototype.isPrototypeOf(reallyDo) 为 false
console.log("zzzzzz".replaceAll("Z","r",true)); //rrrrrr
//reallyDo 是正则,RegExp.prototype.isPrototypeOf(reallyDo) 为 true
console.log("zzzzzz".replaceAll(new RegExp("z","gm"),"r",false));//rrrrrr
代码注释:
参数 (String | RegExp)reallyDo
代表被替换的字符串,(String)replaceWidth
代表替换的字符串,(Boolean)ignoreCase
为是否忽略大小写
String.prototype.replaceAll=function(reallyDo,replaceWith,ignoreCase){}
,在String原型对象上添加一个方法,第一个参数可以是要被替换的字符串或者是一个匹配要被替换字符串的正则表达式,第二个参数规定使用哪些字符串进行替换,第三个参数是一个布尔值,用来规定是否忽略字符大小写,如果是true则忽略,否则不忽略。
if(!RegExp.prototype.isPrototypeOf(reallyDo))
,判断RegExp.prototype是否在参数reallyDo的原型链中,如果在的话,说明reallyDo是一个正则表达式 ,这段代码判断第一个参数是否是一个正则表达式。
return this.replace(new RegExp(reallyDo, (ignoreCase ? "gi": "g")), replaceWith)
,如果不是正则表达式,将replace方法参数第一个参数创建一个正则表达式对象,并且根据ignoreCase参数来决定是否忽略大小写。
else{return this.replace(reallyDo, replaceWith);}
,如果是一个正则表达式对象,那就直接使用就可以了。
③ 另样的全部替换
var str = "男的女的老的少的";
var replaceStr = "的";
console.log(str.split(replaceStr).join('')); //男女老少
jQuery replaceAll() 方法
$(content).replaceAll(selector)
replaceAll() 方法把被选元素替换为新的 HTML 元素,即selector
被content
替换。同时,一旦完成替换,被替换元素中的全部事件都将消失。
<script>
$(document).ready(function(){
$("p").click(function(){
$("<b>执行后内容</b>").replaceAll("p");
});
});
</script>
<p>原内容</p>
//执行replaceAll()后,替换掉原p标签及其内容
<b>执行后内容</b>
jQuery的 replace() 同JS