javascript中使用replace功能很强大,不仅可以替换为字符串,还可以利用正则表达式,对匹配到的字符串为所欲为的进行操作,首先我们来了解一下replace的基本语法

定义和用法

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

语法

stringObject.replace(regexp/substr,replacement)

 返回值

一个新的字符串,是用 replacement 替换了 regexp 的第一次匹配或所有匹配之后得到的。

 说明

字符串 stringObject 的 replace() 方法执行的是查找并替换的操作。它将在 stringObject 中查找与 regexp 相匹配的子字符串,然后用 replacement 来替换这些子串。

如果 regexp 具有全局标志 g,那么 replace() 方法将替换所有匹配的子串。否则,它只替换第一个匹配子串。

为了对replace更深刻的认识,首先我们来练习以下Demo;

var stringObj="中国人民共和国,我是中国人";
var str=stringObj.replace("中国","美国");
console.log(str);

输出的结果为: 美国人民共和国,我是中国人

只替换了第一个中国,如果有多个中国,则需要一个个替换,非常的麻烦,这时候可以用正则表达式替换;这时我们可以用正则表达式:

var stringObj="中国人民共和国,我是中国人";
var reg=new RegExp("中国","g");
var str=stringObj.replace(reg,"美国");
console.log(str);

输出的结果为: 美国人民共和国,我是美国人

Regexp中的g 表示全局标志,那么replace() 方法会替换所有匹配的子串,否则,它只替换第一个匹配的字串。

如果上面例子中这样写:var reg=new RegExp("中国"); 则只会替换第一个中国

我们在replace函数中,经常会遇到$1,$2,$3…这种符号,可能我们对这个不太了解,它表示的是与regexp中的第一个,第二个,第三个…表达式相匹配的文本

var stringObj="中华人民共和国,你好哈中华";
var str=stringObj.replace(/(中华)/g,"<font color=red>$1</font>");
console.log(str); //以上代码还可以写成这样:
var stringObj="中华人民共和国,你好哈中华";
var reg=new RegExp("(中华)","g");
var str=stringObj.replace(reg,"<font color=red>$1</font>");
console.log(str);

输出的结果为:<font color=red>中华</font>人民共和国,你好哈<font color=red>中华</font>

$1表示的是第一个子匹配,同理$2表示的是第二个子匹配(就是左边表达式的第一个括号,第二个括号)

例如:我们将”Alice,Rock” 转换为: “Rock,Alice”

var stringObj="Alice,Rock";
var reg=new RegExp("(\\w+)\s*,\s*(\\w+)");
var str=stringObj.replace(reg,"$2,$1");
console.log(str);

输出:  Rock,Alice

也可以写成:stringObj.replace(/(\w+)\s*, \s*(\w+)/, "$2 $1");

Replace函数的第二个参数replacement 可以是字符串,也可以是函数,例如:

var strObject="他今年28岁,他女儿今年6岁,他老婆今年28岁";
function test($1){
var year=new Date().getFullYear()-parseInt($1);
console.log($1);
return $1+"("+year+"年出生)"
} var reg=/(\d+)岁/g;
var str=strObject.replace(reg,test);
console.log(str);

输出的结果为:

28岁

6岁

28岁

他今年28岁(1987年出生),他女儿今年6岁(2009年出生),他老婆今年28岁(1987年出生)

输出3 次是因为匹配到了三次,所以test执行了三次,最后把匹配的字符进行运算,返回新的字符串,所以说可以对匹配到的字符为所欲为。

RegExp对象有两种语法

直接量语法

/pattern/attributes

创建 RegExp 对象的语法:

new RegExp(pattern, attributes);

attributes参数有三种值

i  大小写不敏感的匹配

g  执行全局匹配 (查找所有的匹配而非找到第一个匹配停止)

m 执行多行匹配

对比这两种写法:对象创建法需要对引号“和转义符号“\”等进行二次转义:如:

var reg=/(\d+)岁/g;
// 等价于:
var reg=new RegExp("(\\d+)岁","g"); var reg=/(中华)/g
// 等价于:
var reg=new RegExp("中国","g");

综合练习

用replace取出<meta name="location" content="province=海南;city=三亚;coord=109.518466229644,18.2585830170558"> 标签中content的内容(不包括双引号)

var strObj='<meta name="location" content="province=海南;city=三亚;coord=109.518466229644,18.2585830170558">';
var str=strObj.replace(/(.*?\")(p.*?)(\".*)/,"$2");
console.log(str);

输出:  province=海南;city=三亚;coord=109.518466229644,18.2585830170558

在javascript中使用replace的更多相关文章

  1. 来一轮带注释的demo,彻底搞懂javascript中的replace函数

    javascript这门语言一直就像一位带着面纱的美女,总是看不清,摸不透,一直专注服务器端,也从来没有特别重视过,直到最近几年,javascript越来越重要,越来越通用.最近和前端走的比较近,借此 ...

  2. JavaScript 中的 replace 方法

    定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串. stringObject.replace(regexp/substr,replaceme ...

  3. javascript中通过replace函数搜索和替换指定字符串

    javascript中我们可以通过replace函数替换部分字符串为指定字符串,本文展示了replace的详细用法,并且通过范例演示了如何进行部分替换.完整替换和不区分大小写替换. javascrip ...

  4. 深入理解 JavaScript 中的 replace 方法(转)

    replace方法是属于String对象的,可用于替换字符串. 简单介绍: StringObject.replace(searchValue,replaceValue) StringObject:字符 ...

  5. Javascript中使用replace()方法+正则表达式替换掉所有字符

    Js中的replace方法,只能替换掉第一次匹配到的字符,   而我们经常需要替换一个字符串中所有的匹配字符,这时候可以用正则表达式: str.replace(/a/g,"b"); ...

  6. 【小贴士】探一探javascript中的replace

    javascript字符串与数组有很多精巧的方法,比如splice.indexOf,而replace在字符串处理中偶尔会产生让人愉悦的效果 比如underscore中的模板引擎替换部分,又如信用卡分割 ...

  7. javascript中的replace方法

    1.replace 调用方法str.replace(regexp|substr, newSubStr|function) regexp,正则表达式 substr,需要被替换的字符串 newSubStr ...

  8. javascript中的replace()方法

    javascript中有很多很好用的操作字符串和数组的方法,replace()就是其中一个. 看看基本用法 var str = '1234512345'; var newStr = str.repla ...

  9. JavaScript中String对象的match()、replace() 配合正则表达式使用

    正则表达式由来已久,查找替换功能非常强大,但模板难记复杂. JavaScript中String对象的match().replace()这2个方法都要使用正则表达式的模板.当模板内容与字符串不相匹配时, ...

随机推荐

  1. 禁止"Windows Media Player Network Sharing Service"服务自动启动

    开始 -> 运行 -> gpedit.msc -> 计算机配置 -> 管理模板 -> Windows 组件 -> Windows Media Player -> ...

  2. CAP理论学习

    CAP理论是对分布式系统的3个特性所下的一个定性的结论,可用于指导分布式系统的设计. CAP理论断言任何基于网络的数据共享系统,最多只能满足数据一致性.可用性.分区容忍性三要素中的两个要素. 在英语中 ...

  3. NFS网络文件系统服务(配置实战)

    NFS网络文件系统服务(实战) NFS(Network File System)即网络文件系统,它允许网络中的计算机之间通过TCP/IP网络共享资源.让不同的主机系统(NFS的客户端)可以透明地读写位 ...

  4. push推送服务设计

    PUSH系统架构设计简述 一.网络传输协议的选择 PUSH系统协议选取: UDP协议实时性更好,但是如何处理安全可靠的传输并且处理不同客户端之间的消息交互是个难题,实现起来过于复杂,那就非TCP协议莫 ...

  5. 【转】利用Python中的mock库对Python代码进行模拟测试

    出处 https://www.toptal.com/python/an-introduction-to-mocking-in-python http://www.oschina.net/transla ...

  6. web 开发之js---HTML5之广播聊天室

    那个头标题很有意思js做的 http://www.cnblogs.com/xgao/p/4200985.html

  7. mysql 存储过程初探

    使用存储过程好处在于: 1.隐藏敏感的算法,避免被正常的开发人员看到,把业务逻辑隐藏在数据库中,而非程序代码里 2.简化应用代码程序,放到数据库里肯定就对程序代码简化有好处了 3.不同的开发语言都可以 ...

  8. HDU 5045 5047 5050 5053(上海网络赛E,F,I,L)

    HDU 5045 5047 5050 5053 太菜了,名额差点没保住.吓尿..赶紧开刷树链抛分 5045:状压DP.压缩10个人.因为两个人不能差2以上,所以能够用01表示 5047:推推公式就可以 ...

  9. 自定义TextView带有各类.ttf字体的TextView

    最近项目遇到了将普通文字转化为带有字体样式的文字,这里就涉及到了.ttf文件,我上网百度了不少资料最终终于实现了,现在想想其实并不复杂 1,你需要下载一种.ttf字体文件,你可以从网上找到一种字体的. ...

  10. maven assembly 配置详解

    Maven Assembly插件介绍 博客分类: 项目构建   你是否想要创建一个包含脚本.配置文件以及所有运行时所依赖的元素(jar)Assembly插件能帮你构建一个完整的发布包. Assembl ...