007.正则表达式实战
1.匹配以数字结尾的;
正则:/\d+$/g;
2.去掉空格;
var str = "我 是 胖 先 森";
console.log(str.replace(/\s+/g,""));//我是胖先森
3.判断字符串是不是由数字组成;
var str = "123344我 是 胖 先 森1123344";
console.log(/^\d*$/.test(str)); //false
var str2 = "123445566";
console.log(/^\d*$/.test(str2)); // true
4.电话号码正则
分析如下:电话号码有区号(3-4位数字),区号之后使用 ”-” 与电话号码连接;
区号正则:^\d{3,4}
电话号码7~8位 正则 \d{7,8}
电话号码也有分机号,分机号为3-4位数字,非必填项,如果要填写的话,则以”-”与电话号码相连接。
正则 (-\d{3,4})?
因此正则匹配电话号码正则为:
/^\d{3,4}-/d{7,8}(-\d{3,4})?$/;
5.手机号码正则
手机号码需要匹配;手机号码开头不以0开始的,并且是11位数字,目前的手机号码有如下开头的:13,14,15,17,18开头的;因此正则如下:
/(^1[3|4|5|7|8][0-9]{9}$)/
如下测试代码:
var str = 15606512345;
var reg = /(^1[3|4|5|7|8][0-9]{9}$)/;
console.log(reg.test(str)); //true
6.删除字符串左右空格
// 删除字符串两侧的空白
/*
* 下面的正则的含义是以1个或者多个空白开头的
* | 是或者的意思 或者以1个或者多个空白结尾的
* 也就是去掉头部和尾部的1个或者多个空格
*/
function trim(str) {
return str.replace(/^\s+|\s+$/g,'');
}
var str1 = " 1234 ";
console.log(trim(str1)); // 输出去掉空格的 1234
7.限制文本框只能输入数字和小数点(二位小数点)
分析:开头有0个或者多个数字,中间有0个或者1个小数点,小数点后面有0个或者最多2个数字;
/*
/^\d*\.?\d{0,2}$/
*/
//测试代码如下:
var reg = /^\d*\.?\d{0,2}$/;
var str1 = .9;
console.log(reg.test(str1)); // true
var str2 = 1.99;
console.log(reg.test(str2)); // true
var str3 = "1a.99";
console.log(reg.test(str3)); // false
8.替换小数点前面的内容为指定内容
var href = "aa.php?d=1";
var reg = href.replace(/\b^(\w*)(?=\.)/,"bb");
console.log(reg); // bb.php?d=1
代码分析如下:
如上代码的含义是 使用正则replace替换操作
找出以字母数字下划线开头的字符,前面以\b分隔单词与边界的地方
因此会找出第一个字符串中第一个开头的字符,后面是以捕获性分组来匹配
后面紧跟着一个.号的匹配,分组只匹配位置,不匹配字符,是零宽度的;
9.匹配中文的正则
使用 Unicode,必须使用\u开头,接着是字符编码的四位16进制表现形式。
console.log(/[\u4E00-\u9FA5\uf900-\ufa2d]/g.test("我是")); //true
10.返回字符串中 中文字符的个数。
分析:使用replace方法把不是中文字符全部替换成空
返回被替换的字符,因此是中文字符;
var str = "111我是涂根华说得对aaaaa1234556";
var reg = /[^\u4E00-\u9FA5\uf900-\ufa2d]/g;
var val = str.replace(reg,'');
console.log(val); // 我是涂根华说得对
console.log(val.length); // 长度为 8
11.正则获取ip地址的前三段
比如如:192.168.16.162 需要变成 192.168.16
分析:使用正则匹配 .号后面带1-3位数字即可,
且以数字结尾的,把他们替换成空字符串。
代码如下:
var ip = "192.168.16.162";
console.log(ip.replace(/\.\d{1,3}$/,""));// 192.168.16
- 匹配标签中的内容
比如匹配如代码
<ul><li>aaa</li><li>bbb</li></ul>
分析: 想获取ul中的内容,可以对匹配的内容使用分组
然后打印RegExp.$1 就获取到分组的内容了; 匹配所有字符
使用[\s\S]+ 空白和非空白的所有字符,且使用修饰符g代表全局的
如下代码:
var str2 = "<ul><li>aaa</li><li>bbb</li></ul>";
str2.match(/<ul>([\s\S]+?)<\/ul>/g);
console.log(RegExp.$1); //<li>aaa</li><li>bbb</li>
- 匹配标签中的文本。
匹配文本思路:可以先把字符串内的所有标签替换成空字符串
因此返回的就是文本了;
正则/<\/?[\s\S]+?>/gi
如下代码:
var str3 = "<ul><li>aaa</li><li>bbb</li></ul>";
var c = str3.replace(/<\/?[\s\S]+?>/gi,"");
console.log(c); // aaabbb
14.正则获取文件名
文件名有如下几种
- c:\images\tupian\006.jpg
- C:\006.JPG
- c:\images\tupian\006.jpg;
- c:\images\tupian\aa.jpg;
- c:/images/tupian/test2.jpg;
正则如:/[^\\\/]*[\\\/]+/gi;
- 上面的正则含义是:[^\/]* 不以一个\ 或者 2个\ 或者 /(需要转义,使用)这样的反斜杠开头的
- 零个或者多个字符,后面紧跟以一个\ 或者 两个\ 或者 /(需要转义,使用)这样一个或者多个分隔符
- 全局匹配;
var s1 = "c:\\images\\tupian\\006.jpg",
s2 = "c:\\images\\tupian\\aa.jpg",
s3 = "c:/images/tupian/test2.jpg";
function getFileName(str){
var reg = /[^\\\/]*[\\\/]+/gi;
str = str.replace(reg,'');
return str;
}
console.log(getFileName(s1)); // 006.jpg
console.log(getFileName(s3)); // test2.jpg
15.绝对路径变成相对路径
比如绝对路径 http://172.16.28.162/images/a.jpg 需要替换成./images/a.jpg
使用正则匹配 http:// //需要使用转义字符转义的 继续匹配除/以外的任何一个字符
直到有反斜杠/为止;然后替换成 . 字符
代码如下:
var reg = /http:\/\/[^\/]+/g;
var r1 = "http://172.16.28.162/images/a.jpg";
console.log(r1.replace(reg,'.')); // ./images/a.jpg
16.用户名正则
匹配规则:只能是中文,英文,数字,下划线,4-16个字符;
匹配中文字符正则:/[\u4E00-\u9FA5\uf900-\ufa2d]/
\w
是 匹配英文,数字,下划线
var reg = /^[\u4E00-\u9FA5\uf900-\ufa2d\w]{4,16}$/;
var str = "我是12345678aa_123";
console.log(reg.test(str)); // true
var str = "我是12345678aa_1235";
console.log(reg.test(str)); // 17位 false
17.匹配英文地址
匹配规则:包含点,字母,空格,逗号,数字,但是开头和结尾必须为字母
分析:开头必须为字母可以这样写 /^[a-zA-Z]/
结尾必须为字母可以这样写:/[a-zA-Z]+$/
中间包含点,字母,空格,逗号,数字的正则:/[.a-zA-Z\s,0-9]?/
外面的号是0个或者多个,后面的问号? 代表可有可无;有就匹配,没有就不匹配;
测试代码如下:
var reg = /^[a-zA-Z][\.a-zA-Z\s,0-9]*?[a-zA-Z]+$/;
var str1 = "11aa";
console.log(reg.test(str1)); // false
var str2 = "aa111aaa";
console.log(reg.test(str2)); // true
18.匹配价格
匹配规则: 开头有0个或者多个数字,中间可能有一个小数点,后面有可能有0-2位小数
正则: /^\d*(\.\d{0,2})?$/
var reg = /^\d*(\.\d{0,2})?$/
var num1 = 12;
console.log(reg.test(num1)); // true
var num2 = .01;
console.log(reg.test(num2)); // true
var num3 = 1.01;
console.log(reg.test(num3)); // true
var num4 = "1.aa1";
console.log(reg.test(num4)); //false
var num5 = "1.1a";
console.log(reg.test(num5)); //false
19.身份证号码的匹配
匹配规则:身份证号码有15位或者18位,其中最后一位可能是X,其他全是数字
正则: /^(\d{14}|\d{17})(\d|[xX])$/
var reg = /^(\d{14}|\d{17})(\d|[xX])$/;
var identity1 = "36232919578996x";
console.log(reg.test(identity1)); // true
var identity2 = "36232919578996a";
console.log(reg.test(identity2)); // false
// 16位
var identity3 = "362329195789961x";
console.log(reg.test(identity3)); // false
20.单词的首字母大写
匹配字符串,让其字符串的首个字母大写
正则:/\b(\w)|\s(\w)/g
测试代码如下:
function replaceReg(reg,str) {
// 先转换为小写
str = str.toLowerCase();
return str.replace(reg,function(m){
return m.toUpperCase();
});
}
var reg = /\b(\w)|\s(\w)/g;
var str = "aadfdfCC";
console.log(replaceReg(reg,str)); // Aadfdfcc
21.验证日期格式
日期格式有2种 第一种是yyyy-mm-dd 或 yyyy/mm/dd
分析 月和天数可以有1位或者2位
正则:/^\d{4}[-\/]\d{1,2}[-\/]\d{1,2}$/;
var reg = /^\d{4}[-\/]\d{1,2}[-\/]\d{1,2}$/;
var d1 = "2015-12-1";
console.log(reg.test(d1)); //true
var d2 = "2015-12-02";
console.log(reg.test(d2)); //true
var d3 = "2015/12/12";
console.log(reg.test(d3)); // true
22.验证邮箱的正则表达式
思路分析: 邮箱的规则是: 由3部分组成
由1个或者多个字母数字下划线和杠 + @ + 1个或者多个字母数字下划线和杠 + . + 1个或者多个字母数字下划线和杠
因此正则:/^([a-zA-Z_0-9-])+@([a-zA-Z_0-9-])+(\.[a-zA-Z_0-9-])+$/
测试代码如下:
var reg = /^([a-zA-Z_0-9-])+@([a-zA-Z_0-9-])+(\.[a-zA-Z_0-9-])+/;
var email1 = "tugenhua@126.com";
console.log(reg.test(email1)); //true
var email2 = "879083421_aaAA@qqAAzz_AA.comaaa";
console.log(reg.test(email2)); // true
23.匹配代码中的a链接
比如<a href='http://www.baidu.com'>222</a> 匹配这样的
使用正则:/<a[.\s]*href\s*=\s*'http:\/\/.*'>\w*<\/a>/gi;
测试代码如下:
var reg = /<a[.\s]*href\s*=\s*'http:\/\/.*'>\w*<\/a>/gi;
var html = "<div><a href='http://www.baidu.com'>222</a><p>344</p></div>";
console.log(html.match(reg)); // ["<a href='http://www.baidu.com'>222</a>"]
var html2 = "<div><a href='http://www.baidu.com'>222</a><p>344</p><a href='http://www.baidu2.com'>333</a></div>";
console.log(html2.match(reg)); //["<a href='http://www.baidu.com'>222</a><p>344</p><a href='http://www.baidu2.com'>333</a>"]
- 正则判断标签是否闭合
没有闭合的标签有2种 类型 一种像img标签那样的
<img src=""
还有一种像div或者p标签那样的
<div>aaa</div>
<p></p>
分析:先匹配起始标签 如<img
或<p
使用正则:/<[a-z]+/i
接着匹配标签里面的多个属性 使用正则/(\s*\w*?\s*=\s*.+?)*(\s*?>[\s\S]*?(<\/\1>)+|\s*\/>)/i
因此整个正则表达式合并为/<([a-z]+)(\s*\w*?\s*=\s*.+?)*(\s*?>[\s\S]*?(<\/\1>)+|\s*\/>)/i
正则分析如下:
首先我们匹配像img标签或者div标签的开头位置时候<img
或<div
使用正则/<([a-z]+)/i
以<
开始[a-z]
中任意一个字符,修饰符+是一个或者多个字符 i代表不区分大小写(\s*\w*?\s*=\s*.+?)*
的含义是:比如<img src = ""
或<div id = ""
先\s*
匹配0个或多个空白\w*
匹配0个或者多个(数字或者字母或下划线) 后面的问号?(尽可能少的匹配)
接着\s*
匹配0个或者多个空白 = 号紧接后面的\s*
也是匹配0个或者多个空白.+?
的含义是匹配除换行符之外的任意一个或多个字符(尽可能少的匹配);
下面我们继续看标签的闭合 标签闭合有2种,一种像img
这样的<img src=""/>
还有一种是<div></div>
这样的;
如果是类似img
标签这样的话,匹配结束字符为/>
匹配正则为:(\s*\/>)
; 如果是div这样的话 正则为:(\s*?>[\s\S]*?<\/\1>)
<\/\1>
的含义是:指的是([a-z]+)
这个分组
整个正则/<([a-z]+)(\s*\w*?\s*=\s*".+?")*(\s*?>[\s\S]*?<\/\1>)|\s*\/>/i
注意:在元字符* 或者 + 号后加一个问号(?) 目的是尽可能少的匹配;
var reg = /<([a-z]+)(\s*\w*?\s*=\s*".+?")*(\s*?>[\s\S]*?<\/\1>)|\s*\/>/i;
var str1 = "![](aa)";
var str2 = "<div></div>";
console.log(reg.test(str1)); // true
console.log(reg.test(str2)); // true
var str3 = "<img src='bb'";
console.log(reg.test(str3)); // false
var str4 = "<div>aaa";
console.log(reg.test(str4)); // false
//但是如上正则对下面的这个demo列子就不适用了;相同的标签嵌套没有闭合的情况下 如下
var str5 = "<div><div>aaa</div>";
console.log(reg.test(str5)); // true 实际上是false 因为有没有闭合标签
25.获取标签里面的内容
正则和上面一样 只是使用了一个分组后,再获取那个分组即可;
var str = "<div>111</div>";
str.match(/<([a-z]+)(\s*\w*?\s*=\s*".+?")*\s*?>([\s\S]*?)<\/\1>/);
console.log(RegExp.$3); // 111
26.正则判断是否为数字和字母的混合
规则:字母和数字的混合
正则如: /^(([a-z]+)([0-9]+)|([0-9]+([a-z]+)))[a-z0-9]*$/i
分析:
-
^([a-z]+)([0-9]+)
含义是 以1个或多个字母开头 后面紧跟1个或者多个数字 -
^([0-9]+([a-z]+))
或者是以1个或者多个数字开头 后面紧跟1个或者多个字母 -
[a-z0-9]*$
后面还可以紧跟数字或者字母0个或者多个
测试代码如下:
var reg = /^(([a-z]+)([0-9]+)|([0-9]+([a-z]+)))[a-z0-9]*$/i;
var str1 = "aaaa";
var str2 = "aa22";
var str3 = "111sddtr";
var str4 = "问问啊啊啊ass";
var str5 = "1111ssdsd111sasddas";
console.log(reg.test(str1)); //false
console.log(reg.test(str2)); // true
console.log(reg.test(str3)); // true
console.log(reg.test(str4)); // false
console.log(reg.test(str5)); // true
27.将阿拉伯数字转换为中文大写字符
var arrs = ["零","壹","贰","叁","肆","伍","陆","柒","捌","玖"];
function replaceReg2(reg,str){
return str.replace(reg,function(m){return arrs[m];})
}
var reg = /\d/g;
var str1 = '13889294444';
var str2 = '12889293333';
var str3 = '23445567';
console.log(replaceReg2(reg,str1)); // 壹叁捌捌玖贰玖肆肆肆肆
console.log(replaceReg2(reg,str2)); // 壹贰捌捌玖贰玖叁叁叁叁
console.log(replaceReg2(reg,str3)); // 贰叁肆肆伍伍陆柒
28.替换文本中的url为链接
比如一段文本中有 aaaaahttp://www.baidu.combbbbb
需要替换成 aaaaa<a href="http://www.baidu.com">http://www.baidu.com</a>bbbbb
分析:最主要的还是需要正则匹配http://www.baidu.com
的url
正则如:/http:\/\/\w*(\.\w*)+/ig;
var str1 = "aaaaahttp://www.baidu.com bbbbb";
//var reg = /http:\/\/\w*(\.\w)+/ig;
var reg = /http:\/\/\w*(\.\w*)+/ig;
function replaceUrl(reg,str) {
return str.replace(reg,function(r){
return "<a href='"+r+"'>"+r+"</a>";
});
}
console.log(replaceUrl(reg,str1));
// aaaaa<a href='http://www.baidu.com'>http://www.baidu.com</a> bbbbb