[TOC] # 3.1正则表达式的组成 \-个正则表达式**可以由简单的字符构成**,比如/abc/ ,**也可以是简单和特殊字符的组合**,比如/ab\*c/。其中 特殊字符也被称为**元字符**,在正则表达式中是具有**特殊**意义的专用**符号**,如^、$、+等。 特殊字符非常多,可以参考: ●MDN :[https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Regular\_Expressions](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions) ●jQuery 手册:正则表达式部分 ●正则测试工具:[http://tool.oschina.net/regex](http://tool.oschina.net/regex) 这里我们把元字符划分几类学习。 ## 3.2边界符 正则表达式中的边界符(位置符)用来**提示字符所处的位置**,主要有两个字符。 | 边界符 | 说明 | | --- | --- | | ^ | 表示匹配行首的文本(以谁开始) | | $ | 表示匹配行尾的文本(以谁结束) | 如果^ 和$在一起，表示必须是精确匹配。  ## 3.3字符类 字符类表示有一系列字符可供选择 ,只要四配其中一个就可以了。**所有可供选择的字符都放在方括号内**。 2\. \[-\]方括号内部范围符- ~~~ //var rg = /abc/ ; 只要包含abc就可以 1.//字符类: []表示有一系列字符可供选择，只要匹配其中一个就可以了 var rg = /[abc]/; //只要包含有a或者包含有b或者包含有c都返回为true 2.var rg1 = /^[abc]$/; //三选一只有是a或者是b或者是c这三个字母才返回true console.log(rg1.test('aa ' )); 3.var reg = /^[a-z]$/; // 26个英文字母任何一个字母返回true console.log(reg.test('a')); ~~~ ### 3.字符组合 ~~~ /^[a-z0-9]$/.test('a') // true ~~~  方括号内部可以使用字符组合,这里表示化含a到z的26个英文字母和0到9的数字都可以。 ### 4.\[^\]方括号内部取反符^ ~~~ /^[^abc]$/.test('a') // false ~~~  ## 3.4量词符 量词符用来设定**某个模式出现的次数。** | 量词 | 说明 | | --- | --- | | \* | 重复零次或更多次 | | + | 重复一次或更多次 | | ? | 重复零次或一~次 | | {n} （重点） | 重复n次 | | {n,} （重点） | 重复n次或更多次 | | {n,m} （重点） | 重复n到m次 | ~~~ 1. *相当于>= 0可以出现0次或者很多次 // var reg = /^a*$/ ; 2.+相当于>= 1可以出现1次或者很多次 var reg = /^a+$/ ; 3.？相当于 1||0 （1个或者0个） var reg =/^a?$/ ; 4.{3 }就是重复3次 var reg = /^a{3I}$/; 5.{3,}大于等于3 var reg=/^a{3, }$/; 6.{3,16} 大于等于3并且小于等于16 var reg=/^a{3,6}$/; ~~~ ### 重点 设定某个模式出现的次数 ~~~ // 量词是设定某个模式出现的次数 var reg = /^[a-zA-Z0-9_-]{6,16}$/ ; // {6,16}中间不要有空格 ~~~ ## 3.5括号总结 1.大括号量词符．里面表示重复次数 2.中括号字符集合。匹配方括号中的任意字符. 3.小括号表示优先级 可以在线测试:[https://c.runoob.com/](https://c.runoob.com/) ~~~ 1.中括号字符集合.匹配方括号中的任意字符. // var reg = /^[abc]$/; //a也可以b也可以C可以a ||b || C 2.大括号量词符.里面表示重复次数 // var reg = /^abc{3}$/; //它只是让c重复三次 abccc 3.大括号量词符.里面表示重复次数 // var reg = /^abc{3}$/; //它只是让c重复三次 abccc ~~~ ## 3.6预定义类; （简写 方便） 预定义类指的是**某些常见模式的简写方式。**（大写 是 取反） | 预定类 | 说明 | | --- | --- | | \\d | 匹配0-9之间的任一-数字, 相当于\[0-9\] | | \\D | 匹配所有0-9以外的字符，相当于\[^0-9\] | | \\w | 匹配任意的字母、数字和下划线，相当于\[A-Za-20-9. \] | | \\W | 除所有字母、数字和下划线以外的字符，相当于\[^A-Za-z0-9 \] | | \\s | 匹配空格(包括换行符、制表符、空格符等)，相等于\[ \\trln\\v\\f\] | | \\S | 匹配非空格的字符，相当于\[^ \\t\\r\\n\\v\\f\] | ### 座机号码验证 ~~~ //座机号码验证: 全国座机号码 两种格式: 010-12345678或者0530- 1234567 //正则里面的或者符号| var reg = /^\d{3}-\d{8}|\d{4}-\d{7}$/; var reg = /^\d{3,4}-\d{7,8}$/ ; ~~~ # 案例:用户名验证 功能需求: 1.如果用户名输入合法，则后面提示信息为:用户名合法，并且颜色为绿色 2.如果用户名输入不合法 则后面提示信息为:用户名不符合规范并且颜色为绿色 ## 分析: 1.用户名只能为英文字母数字,下划线或者短横线组成, 并且用户名长度为6~ 16位. 2.首先准备好这种正购表达式模式/$\[a-zA-Z0-9-\_ \]{6,16}^/ 3.当表单失去焦点就开始验证. 4.如果符合正则规范 则让后面的span标签添加right类. 5.如果不符合正则规范，则让后面的span标签添加wrong类. ## 实验代码  # 2.案例:表单验证  ## 代码实验  判断语句封装函数，调用  确认密码