javascript正则表达式中的replace方法详解

前面的文章我已经介绍了正则的四个基本方法,当时也提到过replace方法

我们来回顾一下replace方法的使用:
先定义一个正则对象:var re=/中间写匹配的条件/;
replace():正则匹配字符串,若是匹配成功,将匹配成功的字符串用新的字符串来替换
语法:字符串.replace(re,新的字符串);

举个例子:网络中经常会遇到,不文明的词会被*代替,我们来试一下:

<!DOCTYPE>
<html>
<head>
  <meta charset='utf-8'>
  <title></title>
</head>
<script type="text/javascript">
window.onload=function(){
  var oTxtarea=document.getElementsByTagName('textarea');
  var oInpt=document.getElementById('bt');
  var re=/你妹|fuck|你大爷|萌萌/g;
  oTxtarea[0].value='我要看你妹,不行,你大爷,我要萌萌你妹,不行,你想想的太多了';
  oInpt.onclick=function(){
    oTxtarea[1].value=oTxtarea[0].value.replace(re,'*');
  };
};
</script>
<body>
  <textarea rows='7' cols='20'>
  </textarea><br />
  <input id='bt' type='button' value='转化不文明的语言'><br />
  <textarea rows='7' cols='20'>
  </textarea><br />
</body>
</html>

当然了,我们对上面的转化效果不满意,我想要实现的是,转化了几个字就显示几个*号

这时候我们就需要进行分析了,其实,replace(参数1,参数2)中的参数2可以是回调函数,我们对程序进行改造一下,将第二个参数换成回调函数,并且给这个回调函数传递一个参数

<!DOCTYPE>
<html>
<head>
  <meta charset='utf-8'>
  <title></title>
</head>
<script type="text/javascript">
window.onload=function(){
  var oTxtarea=document.getElementsByTagName('textarea');
  var oInpt=document.getElementById('bt');
  var re=/你妹|fuck|你大爷|萌萌/g;
  oTxtarea[0].value='我要看你妹,不行,你大爷,我要萌萌你妹,不行,你想想的太多了';
  oInpt.onclick=function(){
    oTxtarea[1].value=oTxtarea[0].value.replace(re,function(obj){
        alert(obj);
        /*alert(obj.length);*/
    });
  };
};
</script>
<body>
  <textarea rows='7' cols='20'>
  </textarea><br />
  <input id='bt' type='button' value='转化不文明的语言'><br />
  <textarea rows='7' cols='20'>
  </textarea><br />
</body>
</html>

可以看出上面的结果很奇怪,第二个参数是回调函数,但是显示回调函数中的参数时,却都是成功匹配到的字符串

那么我们就可以针对这个参数中的每个结果做处理,几个字就产生几个*号

<!DOCTYPE>
<html>
<head>
  <meta charset='utf-8'>
  <title></title>
</head>
<script type="text/javascript">
window.onload=function(){
  var oTxtarea=document.getElementsByTagName('textarea');
  var oInpt=document.getElementById('bt');
  var re=/你妹|fuck|你大爷|萌萌/g;
  oTxtarea[0].value='我要看你妹,不行,你大爷,我要萌萌你妹,不行,你想想的太多了';
  oInpt.onclick=function(){
    oTxtarea[1].value=oTxtarea[0].value.replace(re,function(obj){
        var a='';
        for (var i = 0; i < obj.length; i++) {
          a+='*';
        }
        return a;
    });
  };
};
</script>
<body>
  <textarea rows='7' cols='20'>
  </textarea><br />
  <input id='bt' type='button' value='转化不文明的语言'><br />
  <textarea rows='7' cols='20'>
  </textarea><br />
</body>
</html>

通过上面的例子,是不是又对replace方法了解加深了一步。。。。。

以上所述就是本文的全部内容了,希望大家能够喜欢。

时间: 2015-04-18

javascript中replace( )方法的使用

最近在浏览一些阿里的前端面试题,其中有一题涉及了javascript中replace( )方法的使用,下面是原题: "说出以下函数的作用是?空白区域应该填写什么?" // define (function (window) { function fn(str) { this.str = str; } fn.prototype.format = function () { var arg = ______; return this.str.replace(_______, functio

详解JavaScript 中的 replace 方法

定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串. stringObject.replace(regexp/substr,replacement) 参数 描述 regexp/substr 必需.规定子字符串或要替换的模式的 RegExp 对象. 请注意,如果该值是一个字符串,则将它作为要检索的直接量文本模式,而不是首先被转换为 RegExp 对象. replacement 必需.一个字符串值.规定了替换文本或生成替换文本的函数. 返回值

js replace(a,b)之替换字符串中所有指定字符的方法

如下所示: var str = 'abcadeacf'; var str1 = str.replace('a', 'o'); alert(str1); // 打印结果: obcadeacf var str2 = str.replace(/a/g, 'o'); alert(str2); //打印结果: obcodeocf, 注意: 此处replace的第一个参数为正则表达式,/g是全文匹配标识. 以上这篇js replace(a,b)之替换字符串中所有指定字符的方法就是小编分享给大家的全部内容了,

javascript正则表达式使用replace()替换手机号的方法

本文实例讲述了javascript正则表达式使用replace()替换手机号的方法.分享给大家供大家参考. 具体实现方法如下: 复制代码 代码如下: <html> <head> <title>javascript正则表达式使用replace()替换手机号</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" />

JS中的Replace方法使用经验分享

最近查一个bug,原因是JS中的Replace方法造成的,当将一个字符串中有处需要替换时,一般会用到JS中的Replace方法,Replace方法的第一个参数如果是传的字符串,只会替换第一处.代码如下: 复制代码 代码如下: var str = "0CEA65D5-DB8E-4876-A6F8-C88AC7F0E185,E846C244-8A19-4374-879B-0B1DC08D1747,6CB3EBA4-1E22-4E4D-8800-AE31130B6F5D"; alert(st

js正则表达式replace替换变量方法

JavaScript正则实战(会根据最近写的不断更新) 1.javascript 正则对象替换创建 和用法: /pattern/flags 先简单案例学习认识下replace能干什么 正则表达式构造函数: new RegExp("pattern"[,"flags"]); 正则表达式替换变量函数:stringObj.replace(RegExp,replace Text); 参数说明: pattern -- 一个正则表达式文本 flags -- 如果存在,将是以下值:

使用JS中的Replace()方法遇到的问题小结

今天在写pc客户端自动化打包脚本的时候遇到遇到了几个问题,虽然是小问题,但是也卡了一段时间,所以决定记录一下. js的replace()方法是用于替换某些内容,它可以接收两个参数,第一个是一个被替换的正则表达式对象或者一个字符串,第二个可以是将要替换成的内容或者函数,将要替换成的内容须是一个字符串.我在执行的时候遇到的报错是:Cannot read property 'replace' of undefined.具体代码如下: var fs=require("fs") var info

详解JS正则replace的使用方法

在讲replace的高级应用之前,我们先简单梳理一下JS正则中的几个重要的知识点,以帮助你对基础知识的回顾,然后再讲解JS正则表达式在replace中的使用,以及常见的几个经典案例. 一.正则表达式的创建 JS正则的创建有两种方式: new RegExp() 和 直接字面量. //使用RegExp对象创建 var regObj = new RegExp("(^\s+)|(\s+$)","g"); //使用直接字面量创建 var regStr = /(^\s+)|(\

JavaScript字符串对象replace方法实例(用于字符串替换或正则替换)

JavaScript replace 方法 replace 方法用于在字符串中用一些字符串替换另一些字符串,或者替换符合正则匹配的字符串,并返回替换后的字符串.其语法如下: 复制代码 代码如下: str_object.replace(reg_exp/str, replacement) 参数说明: 参数 说明 str_object 要操作的字符串(对象) reg_exp/str 必需.要匹配的正则表达式/要替换的字符串 如果 reg_exp 具有全局标志 g,那么 replace() 方法将替换所

JavaScript String(字符串)对象的简单实例(推荐)

返回字符串的长度: <html> <body> <script type="text/javascript"> var txt="Hello World!" document.write(txt.length) </script> </body> </html> 为字符串添加样式: <html> <body> <script type="text/java

json字符串对象转换代码实例

这篇文章主要介绍了json字符串对象转换代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 1.将字符串转为json对象:JSON.parse(); 2.json对象转字符串:JSON.stringify(); <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>创建json字符串对象</title

Python字符串的修改方法实例

这篇文章主要介绍了Python字符串的修改方法实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 我们在修改字符串时 通常遇到报错: TypeError: 'str' object does not support item assignment 在Python中,字符串是不可变类型,即无法直接修改字符串的某一位字符. 因此改变一个字符串的元素需要新建一个新的字符串. 常见的修改方法有以几种: 方法1:将字符串转换成列表后修改值,然后用join

JavaScript 中调用 Kotlin 方法实例详解

JavaScript 中调用 Kotlin 方法实例详解 Kotlin 编译器生成正常的 JavaScript 类,可以在 JavaScript 代码中自由地使用的函数和属性 .不过,你应该记住一些微妙的事情. 用独立的 JavaScript 隔离声明 为了防止损坏全局对象,Kotlin 创建一个包含当前模块中所有 Kotlin 声明的对象 .所以如果你把模块命名为 myModule,那么所有的声明都可以通过 myModule 对象在 JavaScript 中可用.例如: fun foo() =

JavaScript字符串对象slice方法入门实例(用于字符串截取)

JavaScript slice 方法 slice 方法用于截取字符串中的一部分并返回该部分字符串.其语法如下: 复制代码 代码如下: str_object.replace(start, end) 参数说明: 参数 说明 str_object 要操作的字符串(对象) start 必需.要截取的开始位置,从 0 开始计算:如果为负数,则从字符串末尾反向开始计算 end 可选.要截取的结束位置,如果省略则到字符串结束:如果为负数,则从字符串末尾反向开始计算 slice 方法实例 复制代码 代码如下:

JavaScript字符串对象split方法入门实例(用于把字符串分割成数组)

JavaScript split 方法 split 方法用于将字符串分割为字符串数组并返回该数组.其语法如下: 复制代码 代码如下: str_object.split(separator, limit) 参数说明: 参数 说明 str_object 要操作的字符串(对象) separator 必需.分隔符,字符串或正则表达式,从该参数指定的地方分割 str_object limit 可选.指定返回的数组的最大长度.如果设置了该参数,返回的子串不会多于这个参数指定的数组.如果省略该参数,则符合规则

JavaScript字符串对象substring方法入门实例(用于截取字符串)

JavaScript substring 方法 substring 方法用于通过指定开始和结束位置来截取字符串并返回截取部分字符串.其语法如下: 复制代码 代码如下: str_object.substring(start, end) 参数 说明 str_object 要操作的字符串(对象) start 必需.开始截取的位置,非负整数 end 可选.字符串截取结束的位置,非负整数:如果省略,则至字符串结束为止 提示:如果参数 start 与 end 相等,那么该方法返回的就是一个空串.如果 sta

JavaScript字符串对象charAt方法入门实例(用于取得指定位置的字符)

JavaScript charAt 方法 charAt 方法用于从字符串中取得指定位置的字符.其语法如下: 复制代码 代码如下: str_object.charAt( x ) 参数说明: 参数 说明 str_object 要操作的字符串(对象) x 必需.表示位置的数字 提示:字符串是从 0 开始计数的. charAt 方法实例 复制代码 代码如下: <script language="JavaScript"> document.write( "jb51"

JavaScript字符串对象substr方法入门实例(用于截取字符串)

JavaScript substr 方法 substr 方法用于根据开始位置和长度截取字符串并返回截取部分字符串.其语法如下: 复制代码 代码如下: str_object.substr(start, length) 参数说明: 参数 说明 str_object 要操作的字符串(对象) start 必需.开始截取的位置,从 0 开始计算:如果为负数则从字符串末尾开始计算(经测试,某些浏览器版本下无效) length 可选.指要截取的字符串长度,省略则至到字符串结束 提示:substr 方法不符合