正则表达式
正则表达式 --- regular expression --- RegExp
用于查找的元字符
* -------- 紧跟前面的一个或一组字符出现 0-N 次
123* ---- 3 可出现 0-N 次
1(23)* --- 23 可出现 0-N 次
+ -------- 紧跟前面的一个或一组字符出现 1-N 次
123+ ---- 3 可出现 1-N 次
1(23)+ --- 23 可出现 1-N 次
？-------- 紧跟前面的一个或一组字符出现 0-1 次
123? ---- 3 可出现 0-1 次
1(23)? --- 23 可出现 0-1 次
(13|) --- 13 可出现 0-1 次 （推荐写法，效率比?高）
^ -------- 必须以 xxx 开头
^a --- 必须以 a 开头
^[0-9] --- 必须 0-9 开头
^a^a ---非法的写法
$ -------- 必须以 xxx 结尾
a$ --- 必须以 a 结尾
[0-9a-zA-Z] --- 必须以数字、字母 结尾
() ------- 分组 和 提高优先级
foo(t|d) --- food 或 foot
. -------- 任意个字符范围没有限制（回车不能匹配）
foo. --- '.'点代表任意字符
[_] ------ 出现在[_]里面的一个字符范围有限制
foo[dtc] --- food、foot 、fooc 其中的一项
| -------- 或(优先级最低) 允许多个字符的匹配
foot | food | fooc --- 返回其中一项
\ -------- 转义字符
表示点: \.
表示[]: \[ \]
表示(): \( \)
表示\ : \\
{} ------- 紧跟在 {} 前面的一个或一组字符出现指定次数
(ab){2} --- ab 以出现 2 次
a{3} --- a 以出现 3 次
a{1,3} --- a 出现 1-3 次
a{1,} --- a 出现 1-N 次
- -------- 连字符（如果ASCII编码是连续的 可以用 '-' 连字符）
[0-9] --- 表示 0-9 之间的数字
[a-z] --- 小写 a-z 之间的字符
[A-Z] --- 大写 A-Z 之间的字符
[9-0] 错误不能反写，编码逆序
\s ------- 空白字符，包括空格、tab、回车、换行等
\S ------- 非空白字符
\w ------- 字母、数字、下划线（非汉字）- JS中和其它语言略有不同
\W ------- 非字符
\d ------- 数字 0-9
\D ------- 非数字
[\s\S] ----- 任意一个字符（数字、字母、下划线、汉字、标点符号、tab 非回车）
// IP 匹配 0-255：分析取值范围
// 一位数（0-9） | 两位数（10-99）| 三位数（100-199） | 三位数（200-249）| 三位数（250-255）
var ip = /^(\d|[1-9]\d|1[\d]{2}|2[0-4]\d|25[0-5])$/; // 0-255
var IP = /^()\.()\.()\.()$/ //IP 将上面（）内，放入到 下面的（）内即可
var fo = /^(|[1-9][\d]*|0)(\.[\d]*[1-9])?$/; //匹配小数
正则表达式对象
由正则表达式创建的对象，该对象可以进行 匹配，提取、查找 和 替换
创建正则表达式对象
1、构造函数
var regex = new RegExp( 正则字符串，匹配模式（可选）)；
2、字面量
var regex = / 正则表达式 / ；
var regex1 = new RegExp('abc');
var regex2 = /abc/;
使用正则进行匹配
将匹配的结果进行解析
语法：
正则对象 . test（字符串） ---- 返回 ( true / false)
var str = 'hfuoerphgou[erhqioitcast[ghohfow[hfupdsghaffdifsfhdjbl'; // 任意字符串
var r1 = new RegExp('itcast'); // 创建正则对象
var r2 = /itcast/;
var res = r2.test(str); // 在字符串 str 里面进行匹配
console.log(res); // true
提取
使用正则可以匹配，使用 exec 可以将匹配到的数据提取出来
语法：
正则对象 . execc ( 字符串 ) --- 将匹配结果 封装数组返回
返回值： [ ' 提取到的值 ' ， 提取到第一个字符的下标，原始字符串]
index： 提取到第一个字符的下标
input： 原始字符串
var str = 'erweou123h56'; // 将字符串中 数字提取出来 var r = /\d+/; var result = r.exec(str); console.log(result); // ["123", index: 6, input: "erweou123h56"] var r = /\d+/; ------- 匹配第一个，之后的不再匹配 var r = /\d+/i; ------- 执行对大小写不敏感的匹配 var r = /\d+/g; ------- 全局匹配（查找所有匹配而非在找到第一个匹配后停止） var r = /\d+/m; ------- 多行匹配
循环提取
在一个字符串中将所有符合要求的字符串提取出来
正则表达式需要要使用全局模式
var r = new RegExp('正则'，'g')
var r = /正则/g
调用 exec 首先获得第一个匹配项，再重复调用，直到最后全部匹配完成返回 null；
var str = 'gd234k543l674'; var r = /\d+/g; // 加个 g 全局 解决多项匹配的问题 ------------------------------------------ r.exec(str); =====> // ["234", index: 2, input: "gd234k543l674"] r.exec(str); =====> // ["543", index: 6, input: "gd234k543l674"] r.exec(str); =====> // ["674", index: 10, input: "gd234k543l674"] r.exec(str); =====> // null ----------------------------------------------
分组提取
分组提取，分组规则：找对应的圆括号
//解析邮件地址
var str = '邮箱 haha@itcast.cn ，邮箱 jeiose@163.com';
var r = /[a-zA-Z\d]+@[a-zA-Z\d]+(\.[a-zA-Z\d]+)+/g;
var s = /([a-zA-Z\d]+)@([a-zA-Z\d]+(\.[a-zA-Z\d]+)+)/g; //分组提取，
var res;
while ( res = s.exec(str) ) {
console.log(res);
}
/*
// 第一组：([a-zA-Z\d]+)
// 第二组：([a-zA-Z\d]+(\.[a-zA-Z\d]+)+)
// 第三组：(\.[a-zA-Z\d]+)
返回捕获的结果
[
"haha@itcast.cn", // 返回的所有匹配项
"haha", // 返回第一组匹配结果
"itcast.cn", // 返回第二组匹配结果
".cn", // 返回第三组匹配结果
index: 3, // 匹配第一个结果的下标
input: "邮箱 haha@itcast.cn ， // 原始字符串
邮箱 jeiose@163.com"
]
*/
匹配但不捕获
语法：( ? : 忽略捕获该匹配项 ) ------ 该项匹配不会被捕获
var str = '邮箱 haha@itcast.cn ，邮箱 jeiose@163.com';
var r = /[a-zA-Z\d]+@[a-zA-Z\d]+(\.[a-zA-Z\d]+)+/g;
var s = /([a-zA-Z\d]+)@([a-zA-Z\d]+(?:\.[a-zA-Z\d]+)+)/g; //分组提取，
var res;
while ( res = s.exec(str) ) {
console.log(res);
console.log(
'邮箱名'+res[0]+
'邮箱'+res[1]+
'主机'+res[2]+
);
}
// 第一组：([a-zA-Z\d]+)
// 第二组：([a-zA-Z\d]+(\.[a-zA-Z\d]+)+)
// 第三组：( ?: \.[a-zA-Z\d]+) 该项捕获被忽略结果不会放到数组
/*
// 返回捕获的结果
[
"haha@itcast.cn", // 返回的所有匹配项
"haha", // 返回第一组匹配结果
"itcast.cn", // 返回第二组匹配结果
index: 3, // 匹配第一个结果的下标
input: "邮箱 haha@itcast.cn ， // 原始字符串
邮箱 jeiose@163.com"
]
*/
反向引用
语法： \数字 ----------------- 引用第几组
\1 -------------------- 引用第 1 组
截取字符串中的一个 html 标签
// <(\w+)>.*<\/1> ====== \1 代表第一组 (\w+)
var str = '123<div>g</div>jgl<p></p>9y345<span>d</span>';
var r = /^<(\w+)>.*<\/1>$/g;
var res;
while (res = r.exec(str)) {
console.log(res);
}
贪婪模式
凡是再正则表达式中，涉及次数限定的，一般默认都尽可能的多匹配 贪婪性能 高于 非贪婪模式
取消贪婪模式： 在次数限定符后面加上一个 ' ? ' 问号
<(\w+)>.*?<\/1>
多个贪婪在一起的强度
/(\d+)(\d+)(\d+)/.exec('1234567') // ["1234567", "12345", "6", "7"]
/(\d+)(\d+)(\d+?)/.exec('1234567') // ["1234567", "12345", "6", "7"]
/(\d+)(\d+?)(\d+)/.exec('1234567') // ["1234567", "12345", "6", "7"]
/(\d+?)(\d+)(\d+)/.exec('1234567') // ["1234567", "1", "23456", "7"]
/(\d+?)(\d+?)(\d+)/.exec('1234567') // ["1234567", "1", "2", "34567"]
/(\d+?)(\d+?)(\d+?)/.exec('1234567') // ["123", "1", "2", "3"]
数组第 0 项 为捕获的所有结果
第 1 项 为分组1 即 $1
第 2 项 为分组2 即 $2
第 3 项 为分组3 即 $4
截取字符串中的一个 html 标签
解决：非贪婪模式下截取的字符串中出现的多余的字符
<div>g</div>jgl<div>g</div> 两个div 中间 多余的 字符
// <(\w+)>.*<\/1> // 1 代表第一组 (\w+)
var str = '123<div>g</div>jgl<div>g</div>jgl<p></p>9y345<span>d</span>';
var r = /^<(\w+)>.*?<\/1>$/g;
var res;
while (res = r.exec(str)) {
console.log(res);
}
否定元字符
语法：[ ^字符 ] ----- 不能出现该 字符
[^abc] ------- 匹配 除 abc 以外的所有字符
正则替换
字符串的替换
语法： 原字符串1 . replace ( 查找字符串2 ， 替换字符串3 ) ---- 返回 字符串
没有找到，原封不动的返回
只替换找到的第一项，后面的不再替换
正则替换
字符串 . replace ( 正则表达式，字符串 ) ---- 返回字符串
var str = 'aaa-----bbb------ccc'
console.log(str.replace(/-+/,'-')); // aaa-bbb------ccc 替换一项
console.log(str.replace(/-+/g,'-')); // aaa-bbb-ccc 全局替换
// 基本替换
'abc123'.replace(/(\d+),'d') // abcd
// 分组替换
'abc123'.replace(/(\d+),'d$1') // abcd123 $1 得到前捕获的结果
// 组引用 (日期引用)
'1991-2-26' . replace (/(\d+)-(\d+)-(\d+),$1年$2月$3日); // 1991年2月26日
'1991-2-26' . replace (/(\d+)-(\d+)-(\d+),$3/$2/$1); // 26/2/1991
函数参数的用法
语法：
原字符串 . replace ( 正则表达式 ， fn );
实例：将邮箱屏蔽成： xx*****@.cn
var str = '我的邮箱：ert@itemail.cn，你的邮箱是hiog@itemail.cn';
/*
fn 参数：s: 返回所有结果
z1: 第一个分组的结果
z2：第二个分组的结果
z3：第三个分组的结果
*/
str.replace(/(\w+)@(\w+(\.\w+)+)/g,function (s,z1,z2,z3) {
// 将用户名 变成 a******* @.cn 的形式
var first = z1,charAt(0);
var star = [];
for(var i = 0; i < z1.length; i++){
star.push('*');
}
return first + star.join('')+'@'+z2;
});
search() 方法
用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，并返回子串的起始位置。
var str = "vistiver bwxking"; var s = "bwxking"; var n = str.search(s); console.log(n); var w = str.search(/bwxking/); console.log(w); // bwxking
正则表达式经常被用于字段或任意字符串的校验，如下面这段校验基本日期格式的JavaScript代码：
var reg = /^(\\d{1,4})(-|\\/)(\\d{1,2})\\2(\\d{1,2})$/;
var r = fieldValue.match(reg);
if(r==null)alert('Date format error!');
下面是技匠整理的，在前端开发中经常使用到的20个正则表达式。
1 . 校验密码强度
密码的强度必须是包含大小写字母和数字的组合，不能使用特殊字符，长度在8-10之间。
^(?=.*\\d)(?=.*[a-z])(?=.*[A-Z]).{8,10}$
2. 校验中文
字符串仅能是中文。
^[\\u4e00-\\u9fa5]{0,}$
3. 由数字、26个英文字母或下划线组成的字符串
^\\w+$
4. 校验E-Mail 地址
同密码一样，下面是E-mail地址合规性的正则检查语句。
[\\w!#$%&'*+/=?^_`{|}~-]+(?:\\.[\\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\\w](?:[\\w-]*[\\w])?\\.)+[\\w](?:[\\w-]*[\\w])?
5. 校验身份证号码
下面是身份证号码的正则校验。15 或 18位。
15位：^[1-9]\\d{7}((0\\d)|(1[0-2]))(([0|1|2]\\d)|3[0-1])\\d{3}$
18位：^[1-9]\\d{5}[1-9]\\d{3}((0\\d)|(1[0-2]))(([0|1|2]\\d)|3[0-1])\\d{3}([0-9]|X)$
6. 校验日期
“yyyy-mm-dd“ 格式的日期校验，已考虑平闰年。
^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$
7. 校验金额
金额校验，精确到2位小数。
^[0-9]+(.[0-9]{2})?$
8. 校验手机号
下面是国内 13、15、18开头的手机号正则表达式。（可根据目前国内收集号扩展前两位开头号码）
^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\\d{8}$
9. 判断IE的版本
IE目前还没被完全取代，很多页面还是需要做版本兼容，下面是IE版本检查的表达式。
^.*MSIE [5-8](?:\\.[0-9]+)?(?!.*Trident\\/[5-9]\\.0).*$
10. 校验IP-v4地址
IP4 正则语句。
\\b(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\b
11. 校验IP-v6地址
IP6 正则语句。
(([0-9a-fA-F]{1,4}:){7,7}[0-9a-fA-F]{1,4}|([0-9a-fA-F]{1,4}:){1,7}:|([0-9a-fA-F]{1,4}:){1,6}:[0-9a-fA-F]{1,4}|([0-9a-fA-F]{1,4}:){1,5}(:[0-9a-fA-F]{1,4}){1,2}|([0-9a-fA-F]{1,4}:){1,4}(:[0-9a-fA-F]{1,4}){1,3}|([0-9a-fA-F]{1,4}:){1,3}(:[0-9a-fA-F]{1,4}){1,4}|([0-9a-fA-F]{1,4}:){1,2}(:[0-9a-fA-F]{1,4}){1,5}|[0-9a-fA-F]{1,4}:((:[0-9a-fA-F]{1,4}){1,6})|:((:[0-9a-fA-F]{1,4}){1,7}|:)|fe80:(:[0-9a-fA-F]{0,4}){0,4}%[0-9a-zA-Z]{1,}|::(ffff(:0{1,4}){0,1}:){0,1}((25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])\\.){3,3}(25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])|([0-9a-fA-F]{1,4}:){1,4}:((25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])\\.){3,3}(25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9]))
12. 检查URL的前缀
应用开发中很多时候需要区分请求是HTTPS还是HTTP，通过下面的表达式可以取出一个url的前缀然后再逻辑判断。
if (!s.match(/^[a-zA-Z]+:\\/\\//))
{
s = 'http://' + s;
}
13. 提取URL链接
下面的这个表达式可以筛选出一段文本中的URL。
^(f|ht){1}(tp|tps):\\/\\/([\\w-]+\\.)+[\\w-]+(\\/[\\w- ./?%&=]*)?
14. 文件路径及扩展名校验
验证windows下文件路径和扩展名（下面的例子中为.txt文件）
^([a-zA-Z]\\:|\\\\)\\\\([^\\\\]+\\\\)*[^\\/:*?"<>|]+\\.txt(l)?$
15. 提取Color Hex Codes
有时需要抽取网页中的颜色代码，可以使用下面的表达式。
^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$
16. 提取网页图片
假若你想提取网页中所有图片信息，可以利用下面的表达式。
\\< *[img][^\\\\>]*[src] *= *[\\"\\']{0,1}([^\\"\\'\\ >]*)
17. 提取页面超链接
提取html中的超链接。
(<a\\s*(?!.*\\brel=)[^>]*)(href="https?:\\/\\/)((?!(?:(?:www\\.)?'.implode('|(?:www\\.)?', $follow_list).'))[^"]+)"((?!.*\\brel=)[^>]*)(?:[^>]*)>
18. 查找CSS属性
通过下面的表达式，可以搜索到相匹配的CSS属性。
^\\s*[a-zA-Z\\-]+\\s*[:]{1}\\s[a-zA-Z0-9\\s.#]+[;]{1}
19. 抽取注释
如果你需要移除HMTL中的注释，可以使用如下的表达式。
<!--(.*?)-->
20. 匹配HTML标签
通过下面的表达式可以匹配出HTML中的标签属性。
<\\/?\\w+((\\s+\\w+(\\s*=\\s*(?:".*?"|'.*?'|[\\^'">\\s]+))?)+\\s*|\\s*)\\/?>
浙公网安备 33010602011771号