js replace正则相关的诡异问题

2016-02-19 09:51 3 1 收藏

下面是个简单易学的js replace正则相关的诡异问题教程,图老师小编详细图解介绍包你轻松学会,喜欢的朋友赶紧get起来吧!

【 tulaoshi.com - Web开发 】

 
测试的昵称:jesse$

查看代码:Javascript代码
代码如下:

$id("f_msg_grow_1").innerHTML=msg["not_club"]["grow_value"].replace(/{NICK_NAME}/,this.info["friend"]["nick_name"]);

看代码很快可以注意到两点:“replace 正则”和“$ ”。

在js 中replace 支持正则表达式,而$ 又恰好是正则向后匹配的特殊字符,很容易想到是正则引起的问题。而据我所知正则向后引用只有$1 、$2 、$3 、$4…… ,而这里只有一个”$” 没有数字。

昵称“jesse$ ”在后台经html 特殊字符处理,传到前端是:“jesse$ ”,看页面结果注意到“$” 后的“&” 的也被替换了。难道是“$&” 在js 里表示正则向后引用的全匹配?

然后去掉了正则,将代码改成:Javascript代码
代码如下:

$id("f_msg_grow_1").innerHTML=msg["not_club"]["grow_value"].replace("{NICK_NAME}",this.info["friend"]["nick_name"]);

居然还是同样的结果,太诡异了!!!

更诡异的是在IE 下查看,居然是显示正确的(之前一直在ff 下测试)!

测试代码:Javascript代码
代码如下:

document.write("姓名:{NAME}".replace(/{NAME}/g,"张剑光$&"));

IE 和ff 显示相同:C-sharp代码
姓名:张剑光{NAME}amp;
经测试,“$&” 果真表示正则向后引用的全匹配,算我孤陋,之前居然不知道!

测试代码:Javascript代码
代码如下:

document.write("姓名:{NAME}".replace("{NAME}","张剑光$&"));

ff 显示:C-sharp代码
姓名:张剑光{NAME}amp
IE 显示:C-sharp代码
姓名:张剑光$&
经测试,ff 下居然replace 即使不用正则,“$&” 也表示向后全匹配!!!
无语!

查找资料、测试并总结如下:

一、

字符

含义

$$

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

$

$&

指定与整个模式匹配的 stringObj 的部分。

$`

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

指定由 $& 描述的匹配之前的 stringObj 部分。

$'

指定由 $& 描述的匹配之后的 stringObj 部分。

测试代码:

代码如下:

document.write("姓名:{NAME}__".replace(/{NAME}/g,"张剑光$&"));
document.write("姓名:{NAME}__".replace(/{NAME}/g,"张剑光$$"));
document.write("姓名:{NAME}__".replace(/{NAME}/g,"张剑光$`"));
document.write("姓名:{NAME}__".replace(/{NAME}/g,"张剑光$'"));

Ie 、ff 和chrome 结果相同:
代码如下:

姓名:张剑光{NAME}amp__姓名:张剑光$__姓名:张剑光姓名:__姓名:张剑光____

二、 ff 和chrome 下replace 不使用正则,也对上述特殊字符起作用
ie 下replace 不使用正则,对上述特殊字符不起作用 测试代码:
代码如下:

document.write("姓名:{NAME}__".replace("{NAME}","张剑光$&"));
document.write("姓名:{NAME}__".replace("{NAME}","张剑光$&"));
document.write("姓名:{NAME}__".replace("{NAME}","张剑光$$"));
document.write("姓名:{NAME}__".replace("{NAME}","张剑光$`"));
document.write("姓名:{NAME}__".replace("{NAME}","张剑光$'"));

ff 和chrome 结果:
代码如下:

姓名:张剑光{NAME}amp__姓名:张剑光$__姓名:张剑光姓名:__姓名:张剑光____

Ie 结果:
代码如下:

姓名:张剑光$&__姓名:张剑光$&__姓名:张剑光$$__姓名:张剑光$`__姓名:张剑光$'__

三、 由此,我们在应用replace 等正则相关函数时,是否有必要特殊处理下上述存在情况呢?
测试代码:
代码如下:

var str = "姓名:{NAME}";
var str2 = "$jesse$";
document.write(str.replace(/{NAME}/g,str2));
document.write("br /");
document.write(str.replace(/{NAME}/g,str2.replace(/$/g,'$$$$')));//注意这里是四个“$”

页面显示:
代码如下:

姓名:{NAME}lt;jesse{NAME}lt;
姓名:$jesse$

你还可以自己测试下:
代码如下:

var str = "姓名:{NAME}";
var str2 = "$jesse$";
document.write(str.replace(/{NAME}/g,str2.replace(/$/g,'$$')));

比较好的做法是:
代码如下:

function tplReplace(str,json){
return str.replace(/{(w+)}/gi,function(a,b){
return b in json ? json[b] : a;
}
}

来源:http://www.tulaoshi.com/n/20160219/1592361.html

延伸阅读
标签: Web开发
(1[0-2]|0?[1-9])[-./](0?[1-9]|[12][0-9]|3[01])[-./](\d\d\d\d) $1 匹配 10,11,12,01,02,03,04,05,06,07,08,09 也是匹配 月份 $2 匹配 01,02...09,10,11....29,30,31 也就是匹配 日期 $3 匹配 0000,0001....9999 也就是匹配 年份 加上 中间的字符集合 以下都会匹配 10/10/1999 10-10-1999 10.10.1999
标签: Web开发
preg_replace 字符串比对解析并取代。  语法: mixed preg_replace(mixed pattern, mixed replacement, mixed subject);  返回值: 混合类型资料  函数种类: 资料处理  内容说明  本函数以 pattern 的规则来解析比对字符串 subject,欲取而代之的字...
标签: Web开发
username1: "(^[a-zA-Z]{1}([a-zA-Z0-9_]){4,14}|(^[\u4E00-\uFA29]{1}+[a-zA-Z0-9\u4E00-\uFA29]{2,7}))$", 代码如下: script !-- function checkStr(str){ // [\u4E00-\uFA29]|[\uE7C7-\uE7F3]汉字编码范围 var re1 = new RegExp("^([\u4E00-\uFA29]|[\uE7C7-\uE7F3]|[a-zA-Z0-9])*$"); if (!re1.test(str)){ alert("否"); return f...
标签: Web开发
http://blog.csdn.net/laily/category/19548.aspx http://blog.csdn.net/laily/archive/2004/06/30/30525.aspx 微软的正则表达式教程(五):选择/编组和后向引用 http://blog.csdn.net/laily/archive/2004/06/30/30522.aspx 微软的正则表达式教程(四):限定符和定位符 http://blog.csdn.net/laily/archive/2004/06/30/30514.aspx 微软的...
标签: Web开发
这里讨论一下我对Javascript中变量相关细节的认识,有不当之处欢迎来批。 一、变量的类型 Javascript和Java、C这些语言不同,它是一种无类型、弱检测的语言。它对变量的定义并不需要声明变量类型,我们只要通过赋值的形式,可以将各种类型的数据赋值给同一个变量。例如: i=100;//Number类型 i="variable";//String类型 i={x:4}...

经验教程

12

收藏

11
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部