由于昨天小伙伴定制的插件中含有大量的JS数据处理逻辑,其中就包含了一些字符串中的指定字符串的替换功能,就恶补了一下前台HTML DOM 中replace() 方法的使用。js的replace()方法是用于替换某些内容,它可以接收两个参数,第一个是一个被替换的正则表达式对象或者一个字符串,第二个可以是将要替换成的内容或者函数,将要替换成的内容须是一个字符串。

replace() 方法的定义与用法

replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。

语法

stringObject.replace(regexp/substr,replacement)

regexp/substr:必需。规定子字符串或要替换的模式的 RegExp 对象。

请注意,如果该值是一个字符串,则将它作为要检索的直接量文本模式,而不是首先被转换为 RegExp 对象。

replacement:必需。一个字符串值。规定了替换文本或生成替换文本的函数。

举例:

利用JS的replace()方法替换字符串中指定字符

代码:

var d = '飞鸟慕鱼博客博主墨除';
txt = d.replace(/墨除/,'墨初');
console.log(txt);
//打印结果:飞鸟慕鱼博客博主墨初

利用JS的replace()方法替换全局字符串中指定字符

代码如下

var d = '飞鸟慕鱼博客博主为墨除,其推出了几款zblog的插件,都是以墨除XXXX为命名的';
txt = d.replace(/墨除/,'墨初');
console.log(txt);
//打印结果:飞鸟慕鱼博客博主为墨初,其推出了几款zblog的插件,都是以墨除XXXX为命名的

通上以上代码我们不能看出,js 的replace()方法默认替换只替换第一个匹配的字符,如果字符串中有超过两个以上的对应字符就无法进行替换,这时候就要进行一点操作,进行全部替换。

全局替换

代码

var d = '飞鸟慕鱼博客博主为墨除,其推出了几款zblog的插件,都是以墨除XXXX为命名的';
txt = d.replace(/墨除/g,'墨初');
console.log(txt);
//打印结果:飞鸟慕鱼博客博主为墨初,其推出了几款zblog的插件,都是以墨初XXXX为命名的

对比一下两段代码的匹配条件 "/墨除/"与"/墨除/g",如果后者可以进行全局的指定字符的替换。

匹配条件"/墨除/g"中的"g”表示全局匹配将替换所有匹配的子串,如果不加'g'当匹配到第一个后就结束了。 

补充点:

1."/ /”这个是固定写法, 

2.'\s”是转移符号用以匹配任何空白字符,包括空格、制表符、换页符等等, 

3."g”表示全局匹配将替换所有匹配的子串,如果不加”g”当匹配到第一个后就结束了。