正则表达式与编程语言无关的用来检索、替换那些符合某个规则的文本。
通常使用场景用于检测文本是否符合一定的规则或者格式。
在JS中可以直接声明正则表达式，需要注意它与字符串区别。字符串需要定义在引号中，正则表达式不需要引号
var str = "haha";
var reg = /^[0-9]$/;
在JS中，正则的使用方式主要有两种
- 完整性检验
- 全局性检验
1. 正则表达式的语法
| 元字符 | 功能 |
|---|---|
| \ | 比如“+”，“*”等符号作为元字符有特定的含义，如果需要检验的格式中有类似的符号，需要使用“\*”表示一个“*” |
| ^ | 表示完整性检验的开始符号 |
| $ | 表示完整性检验的结束符号 |
| * | 表示前方的字符或子表达式出现任意次数，相当于出现了{0,} |
| + | 表示前方的字符或子表达式至少出现一次，相当于出现了{1,} |
| ? | 表示前方的字符或子表达式至多出现一次，相当于出现了{0,1} |
| {n} | 表示前方的字符或子表达式出现n次 |
| {n,} | 表示前方的字符或子表达式至少出现n次 |
| {n,m} | 表示前方的字符或子表达式至少出现n次，至多出现m次 |
| . | 除了\n和\r以外的任何字符 |
| x|y | x或y |
| (xyz) | 括号中的内容作为一个子表达式整体出现，xyz作为一个整体出现 |
| [xyz] | 匹配括号中任一字符即可，相当于x|y|z |
| [^xyz] | 不包含其中的字符，相当于!(x|y|z) |
| [a-z][A-Z][0-9] | 所有小写字母，大写字母，数字 |
| [^a-z] | 所有非小写字母 |
| \d | 任意一个数字,相当于[0-9] |
| \D | 任意一个非数字,相当于[^0-9] |
| \w | 任意一个常用字符,相当于[A-Za-z0-9_] |
| \W | 任意一个非常用字符,相当于[^A-Za-z0-9_] |
2. 完整性检验
以/^开始 以$/结尾的一段正则表达式，严格验证所有内容是否符合特定的格式
示例：验证用户输入的身份证号码是否合法
身份证:<input type="text" id="idcard" oninput="test1();">
<span id="sp1"></span>
<script type="text/javascript">
function test1(){
var v = document.getElementById("idcard").value;
var reg = /^\d{17}[\dxX]{1}$/;
if(reg.test(v)){
document.getElementById("sp1").innerText="格式合法";
document.getElementById("sp1").style.color="green";
}else{
document.getElementById("sp1").innerText="格式不合法";
document.getElementById("sp1").style.color="red";
}
}
</script>
也可以通过HTML5新表单特性中
pattern属性，设置文本框提交规则。
required属性，设置文本框必须填写
<form action="#" method="post">
身份证:<input type="text" id="c1" pattern="\d{17}[\dxX]{1}" required>
<input type="submit" value="提交" />
</form>
3. 全局性检验
用于检验内容中是否有部分符合条件
模式是可以组合使用的
| 模式 | 作用 |
|---|---|
| g | 全局性匹配，只有内容有部分符合即可 |
| i | 忽略大小写匹配 |
| m | 换行过程中匹配 |
var reg = /\d/g; //检验内容中是否有数字
var reg = /[abc]/i; //检验内容是否有a,b,c,A,B,C
var reg = /haha/m; //检验内容中是否有haha（haha可以换行中出现）
示例:全局匹配
小写字母检验:<input type="text" id="t1" oninput="test1()"/>
<span id="sp1"></span><br>
<script type="text/javascript">
function test1(){
var v = document.getElementById("t1").value;
var reg = /[a-z]/g;
if(reg.test(v)){
document.getElementById("sp1").innerHTML = "OK";
}else{
document.getElementById("sp1").innerHTML = "";
}
}
</script>
示例:忽略大小写
忽略大小写:<input type="text" id="t2" oninput="test2()"/>
<span id="sp2"></span><br>
<script type="text/javascript">
function test2(){
var v = document.getElementById("t2").value;
var reg = /[abc]/i;
if(reg.test(v)){
document.getElementById("sp2").innerHTML = "OK";
}else{
document.getElementById("sp2").innerHTML = "";
}
}
</script>
