这次来学习replace的用法,首先来初识一下replace
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>replace</title>
</head>
<body>
<script>
var str = "abcd2004-08testok2009-09op";
var reg = /\d{4}/g;
var ms = str.replace(reg,2010);
alert(ms)
</script>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>replace</title>
</head>
<body>
<script>
var str = "abcd2004-08testok2009-09op";
var reg = /\d{4}/g;
var ms = str.replace(reg,2010);
alert(ms)
</script>
</body>
</html>
这里我们需要的是找出字符串中的年,然后将所有的年都替换成2010,运行之后可以看到
结果:abcd2010-08testok2010-09op
成功的将所有的年替换成了2010
但是有时候,我们并不是只要这样简单的替换,我们希望不是替换为一个固定值,而是批量的替换成一种形式
如下面这个例子:将字符串 a:3,b:6,c:9,abc9,sv2op9,a:8 里面的所有 字母:数字 形式字符串的数字加 1
这个时候就不能单纯的替换了,我们需要用到回调函数string.replace(reg,xx)
我们首先分析一下,执行的过程是怎么样的,
1. 首先是要找到我们目标的字符串,这里我们要找 字母:数字,正则为:/[a-z]:\d/g
先找到的是 a:3,于是这个replace里面的回调函数xx就有了2个参数,一个是a:3,一个时符合查找数组该元素的序列号,这里a:3的是0,就是xx(a:3,0)
2. 再继续找到b:6,同上就是xx(b:6,1)
3. 再继续找到c:9,同理就是xx(c:9,2)
4...
利用回调函数的参数,我们就可以想办法,来让数字+1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>replace</title>
</head>
<body>
<script>
var str = "a:3,b:6,c:9,abc9,sv2op9,a:8";
var reg = /[a-z]:\d/g;
var ms = str.replace(reg,xx);
function xx(n){
var reg2 = /\d$/;
var ms2 = n.match(reg2);
var reg3 = /[a-z]:/;
var ms3 = n.match(reg3);
return ms3+(parseInt(ms2)+1);
}
alert(ms);
</script>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>replace</title>
</head>
<body>
<script>
var str = "a:3,b:6,c:9,abc9,sv2op9,a:8";
var reg = /[a-z]:\d/g;
var ms = str.replace(reg,xx);
function xx(n){
var reg2 = /\d$/;
var ms2 = n.match(reg2);
var reg3 = /[a-z]:/;
var ms3 = n.match(reg3);
return ms3+(parseInt(ms2)+1);
}
alert(ms);
</script>
</body>
</html>
结果:a:4,b:7,c:10,abc9,sv2op9,a:9
我用了这样一个傻瓜的方法,把字母:和数字用正则查询分开了,把数字加1,再把查询到的字母:和加了1的数字拼起来!~~~
后来经过教导,我又学到了匿名函数的用法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>replace</title>
</head>
<body>
<script>
var str = "a:3,b:6,c:9,abc9,sv2op9,a:8";
var reg = /[a-z]:\d/g;
var ms = str.replace(reg,xx);
function xx(n){
var reg2 = /\d$/;
var ms2 = n.replace(reg2,function (n){
return parseInt(n)+1;
}
);
return ms2;
}
alert(ms);
</script>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>replace</title>
</head>
<body>
<script>
var str = "a:3,b:6,c:9,abc9,sv2op9,a:8";
var reg = /[a-z]:\d/g;
var ms = str.replace(reg,xx);
function xx(n){
var reg2 = /\d$/;
var ms2 = n.replace(reg2,function (n){
return parseInt(n)+1;
}
);
return ms2;
}
alert(ms);
</script>
</body>
</html>
结果:a:4,b:7,c:10,abc9,sv2op9,a:9
同样得到了结果!~
9月12号是很重要的一天。。。也要为了这天好好加油!!!努力!~~~