JS的replace方法介绍


Posted in Javascript onOctober 20, 2012

该函数的第一个参数是匹配模式的字符串。接下来的参数 是与模式中的子表达式匹配的字符串,可以有 0 个或多个这样的参数。接下来的参数是一个整数,声明了匹配在 stringObject 中出现的位置。最后一个参数是 stringObject 本身。
下文展示了几种javascript正则表示式的repalce方式,有些方式我们很少在别的地方看到,如第二种和第三方中方法。

//下面的例子用来获取url的两个参数,并返回urlRewrite之前的真实Url 
var reg=new RegExp("(https://3water.com/BookReader/)(\\d+),(\\d+).aspx","gmi"); 
var url="https://3water.com/BookReader/1017141,20361055.aspx"; 
//方式一,最简单常用的方式 
var rep=url.replace(reg,"$1ShowBook.aspx?bookId=$2&chapterId=$3"); 
alert(rep); 
//方式二 ,采用固定参数的回调函数 
var rep2=url.replace(reg,function(m,p1,p2,p3){return p1+"ShowBook.aspx?bookId="+p3+"&chapterId="+p3}); 
alert(rep2); 
//方式三,采用非固定参数的回调函数 
var rep3=url.replace(reg,function(){var args=arguments; return args[1]+"ShowBook.aspx?bookId="+args[2]+"&chapterId="+args[3];}); 
alert(rep3); 
//方法四 
//方式四和方法三很类似, 除了返回替换后的字符串外,还可以单独获取参数 
var bookId; 
var chapterId; 
function capText() 
{ 
var args=arguments; 
bookId=args[2]; 
chapterId=args[3]; 
return args[1]+"ShowBook.aspx?bookId="+args[2]+"&chapterId="+args[3]; 
} 
var rep4=url.replace(reg,capText); 
alert(rep4); 
alert(bookId); 
alert(chapterId); 
//除了使用replace方法获取正则表示式的分组外,还可以使用test ,exec方法获取分组,只是手法有所不同而已 
var reg2=new RegExp("(https://3water.com/BookReader/)(\\d+),(\\d+).aspx","gmi"); 
var m=reg2.exec("https://3water.com/BookReader/1017141,20361055.aspx"); 
var s=""; 
//获取所有的分组 
for (i = 0; i < m.length; i++) { 
s = s + m[i] + "\n"; 
} 
alert(s); 
bookId=m[2]; 
chapterId=m[3]; 
alert(bookId); 
alert(chapterId); 
//使用test方法获取分组 
var reg3=new RegExp("(https://3water.com/BookReader/)(\\d+),(\\d+).aspx","gmi"); 
reg3.test("https://3water.com/BookReader/1017141,20361055.aspx"); 
//获取三个分组 
alert(RegExp.$1); 
alert(RegExp.$2); 
alert(RegExp.$3); 
var str="www.baidu.com"; 
//str.format("好","q") 
str.replace(new RegExp("(\\.)(bai)du","g"),function(){ 
for(var i=0;i<arguments.length;i++) 
{ 
document.write(arguments[i]+"<br/>"); 
} 
document.write("-------------------------------------------------<br/>"); 
}); 
两个例子(证明,replace传入正则参数和字符传参数结果不同): 
alert("123".replace("1",function(){var un;return un;})); //弹出undefined23 
alert("123".replace(new RegExp("1"),function(){var un;return un;})); //弹出23
Javascript 相关文章推荐
JavaScript中令你抓狂的魔术变量
Nov 30 Javascript
js文件中调用js的实现方法小结
Oct 23 Javascript
JavaScript实现继承的4种方法总结
Oct 16 Javascript
JS+CSS实现表格高亮的方法
Aug 05 Javascript
一篇文章掌握RequireJS常用知识
Jan 26 Javascript
jQuery中选择器的基础使用教程
May 23 Javascript
Vue数据驱动模拟实现1
Jan 11 Javascript
js实现炫酷的左右轮播图
Jan 18 Javascript
bootstrap daterangepicker汉化以及扩展功能
Jun 15 Javascript
bootstrap table表格插件之服务器端分页实例代码
Sep 12 Javascript
Vue CLI3.0中使用jQuery和Bootstrap的方法
Feb 28 jQuery
jquery分页优化操作实例分析
Aug 23 jQuery
Lazy Load 延迟加载图片的jQuery插件中文使用文档
Oct 18 #Javascript
JavaScript 用cloneNode方法克隆节点的代码
Oct 15 #Javascript
基于JQuery的模拟苹果桌面Dock效果(稳定版)
Oct 15 #Javascript
基于JQuery模仿苹果桌面的Dock效果(初级版)
Oct 15 #Javascript
JS自动缩小超出大小的图片
Oct 12 #Javascript
文本框input聚焦失焦样式实现代码
Oct 12 #Javascript
poshytip 基于jquery的 插件 主要用于显示微博人的图像和鼠标提示等
Oct 12 #Javascript
You might like
PHP4之真OO
2006/10/09 PHP
PHP4实际应用经验篇(3)
2006/10/09 PHP
PHPStrom中实用的功能和快捷键大全
2015/09/23 PHP
win平台安装配置Nginx+php+mysql 环境
2016/01/12 PHP
PHP中数组转换为SimpleXML教程
2019/01/27 PHP
JS 对象介绍
2010/01/20 Javascript
JavaScript实现在数组中查找不同顺序排列的字符串
2014/09/26 Javascript
js+div实现文字滚动和图片切换效果代码
2015/08/27 Javascript
js如何判断输入字符串长度
2015/12/16 Javascript
AngularJS实现标签页的两种方式
2016/09/05 Javascript
巧用canvas
2017/01/21 Javascript
jquery.guide.js新版上线操作向导镂空提示jQuery插件(推荐)
2017/05/20 jQuery
详解用node.js实现简单的反向代理
2017/06/26 Javascript
Vue中的异步组件函数实现代码
2018/07/20 Javascript
Vue 组件参数校验与非props特性的方法
2019/02/12 Javascript
mongodb初始化并使用node.js实现mongodb操作封装方法
2019/04/02 Javascript
JavaScript实现移动端弹窗后禁止滚动
2020/05/25 Javascript
vue实现五子棋游戏
2020/05/28 Javascript
vue项目中使用rem,在入口文件添加内容操作
2020/11/11 Javascript
React实现todolist功能
2020/12/28 Javascript
django orm 通过related_name反向查询的方法
2018/12/15 Python
python批量从es取数据的方法(文档数超过10000)
2018/12/27 Python
python文本数据处理学习笔记详解
2019/06/17 Python
python3 自动打印出最新版本执行的mysql2redis实例
2020/04/09 Python
python读取图像矩阵文件并转换为向量实例
2020/06/18 Python
HTML5网页音乐播放器的示例代码
2017/11/09 HTML / CSS
利用HTML5 Canvas制作一个简单的打飞机游戏
2015/05/11 HTML / CSS
Diesel美国网上商店:意大利牛仔时装品牌
2020/12/10 全球购物
纬创Java面试题笔试题
2014/10/02 面试题
Linux的文件类型
2012/03/07 面试题
大学生自荐信
2013/12/11 职场文书
大学自主招生自荐信范文
2014/02/26 职场文书
民主生活会整改措施(党员)
2014/09/18 职场文书
运动会闭幕式致辞
2015/07/29 职场文书
《清澈的湖水》教学反思
2016/02/17 职场文书
MySQL性能指标TPS+QPS+IOPS压测
2022/08/05 MySQL