1、术语含义:RegExp 对象表示正则表达式,是对字符串执行模式匹配的强大工具。(俗称鸟语);
2、作用:正则表达式常用于字符串处理、表单验证(邮箱验证、用户名验证、密码验证以及密码强度验证、昵称验证)等。
3、语法规则:分别是直接量语法、RegExp 对象的语法。
- 直接量语法:/pattern/attributes(/正则/正则属性)。ps:pattern参数是一个字符串,指定了正则表达式的模式或其他正则表达式(就是自己设定的正则表达式);attributes参数是一个可选的字符串,包含属性 "g"、"i" 和 "m",分别用于指定全局匹配、执行对大小写不敏感的匹配和多行匹配。
/*直接量语法*/
var re=/[0-9]/g;/正则表达式/可选的正则属性(g/i/m);
- RegExp 对象的语法:new RegExp(pattern, attributes);{如果 pattern 是正则表达式,而不是字符串,则必须省略该参数。}
/*如果你需要字符串连接的时候必须用对象的方式写*/
var re=new RegExp("-");
4.正则表达式的常用字符
修饰符
修饰符 | 描述 |
i | 执行对大小写不敏感的匹配。 |
g | 执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)。 |
m | 执行多行匹配。 |
<script type="text/javascript">
var str="123"
var re=/\d/g;/*g:全局匹配*/
alert(str.match(re));/*返回[1,2,3]这个数组*/
</script>
<script type="text/javascript">
var str="asdasAAAA"
var re=/[a-z]/gi;/*gi:全局不区分大小写匹配*/
alert(str.match(re));/*返回数组[a,s,d,a,s,A,A,A,A]*/
</script>
方括号(方括号用于查找某个范围内的字符:)
表达式 | 描述 |
[abc] | 查找方括号之间的任何字符。 |
[^abc] | 查找任何不在方括号之间的字符。 |
[0-9] | 查找任何从 0 至 9 的数字。 |
[a-z] | 查找任何从小写 a 到小写 z 的字符。 |
[A-Z] | 查找任何从大写 A 到大写 Z 的字符。 |
[A-z] | 查找任何从大写 A 到小写 z 的字符。 |
[adgk] | 查找给定集合内的任何字符。 |
[^adgk] | 查找给定集合外的任何字符。 |
元符号(元字符(Metacharacter)是拥有特殊含义的字符):
元字符 | 描述 |
. | 查找单个字符,除了换行和行结束符。 |
\w | 查找单词字符。 |
\W | 查找非单词字符。 |
\d | 查找数字。 |
\D | 查找非数字字符。 |
\s | 查找空白字符。 |
\S | 查找非空白字符。 |
\b | 匹配单词边界。 |
\B | 匹配非单词边界。 |
\0 | 查找 NUL 字符。 |
\n | 查找换行符。 |
\f | 查找换页符。 |
\r | 查找回车符。 |
\t | 查找制表符。 |
\v | 查找垂直制表符。 |
\xxx | 查找以八进制数 xxx 规定的字符。 |
\xdd | 查找以十六进制数 dd 规定的字符。 |
\uxxxx | 查找以十六进制数 xxxx 规定的 Unicode 字符。 |
量词
量词 | 描述 |
n+ | 匹配任何包含至少一个 n 的字符串。 |
n* | 匹配任何包含零个或多个 n 的字符串。 |
n? | 匹配任何包含零个或一个 n 的字符串。 |
n{X} | 匹配包含 X 个 n 的序列的字符串。 |
n{X,Y} | 匹配包含 X 或 Y 个 n 的序列的字符串。 |
n{X,} | 匹配包含至少 X 个 n 的序列的字符串。 |
n$ | 匹配任何结尾为 n 的字符串。 |
^n | 匹配任何开头为 n 的字符串。 |
?=n | 匹配任何其后紧接指定字符串 n 的字符串。 |
?!n | 匹配任何其后没有紧接指定字符串 n 的字符串。 |
5、支持正则表达式的 String 对象的方法(将正则表达式对象作为参数)
search():检索与正则表达式相匹配的值,并且总是从字符串的开始进行检索,这意味着它总是返回 stringObject 的第一个匹配的位置。
{语法:stringObject.search(regexp);ps:search() 方法不执行全局匹配。}
<script type="text/javascript">
var str="Visit W3School!"
document.write(str.search(/W3School/))
/*输出6*/
</script>
<script type="text/javascript">
var str="Visit W3School!"
document.write(str.search(/w3school/))
/*输出-1,因为方法search()对大小敏感,所以匹配是不了,返回-1*/
</script>
match(): match()方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配(返回值是存放匹配结果的数组)。
{
PS:match() 方法将检索字符串 stringObject,以找到一个或多个与 regexp 匹配的文本。这个方法的行为在很大程度上有赖于 regexp 是否具有标志 g。
(1).如果 regexp 没有标志 g,那么 match() 方法就只能在 stringObject 中执行一次匹配。如果没有找到任何匹配的文本, match() 将返回 null。否则,它将返回一个数组,其中存放了与它找到的匹配文本有关的信息。
(2).如果 regexp 具有标志 g,则 match() 方法将执行全局检索,找到 stringObject 中的所有匹配子字符串。若没有找到任何匹配的子串,则返回 null。如果找到了一个或多个匹配子串,则返回一个数组。
}
{语法:(1)stringObject.match(searchvalue);(2)stringObject.match(regexp);}
<script type="text/javascript">
var str="1 plus 2 equal 3"
document.write(str.match(/\d+/g));
/*输出1,2,3。(全局匹配字符串的数字)数组类型*/
var str="1 plus 2 equal 3"
document.write(str.match(/\d+/));
/*输出1(只匹配一次字符串的数字)。数组类型*/
</script>
replace(): replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。
{
语法:stringObject.replace(regexp/substr,replacement);
参数regexp/substr:必需。规定子字符串或要替换的模式的 RegExp 对象。
参数replacement:必需,replacement可以是字符串,也可以是函数。如果它是字符串,那么每个匹配都将由字符串替换;如果它是函数,在这种情况下,每个匹配都调用该函数,它返回的字符串将作为替换文本使用。
}
<script type="text/javascript">
/*当参数replacement作为字符串,如下:*/ var str="fasdd+dddsww*(*()*"; var re=/\+/;/*转义*/ document.write(str.replace(re,"\n"));/*将'+'号替换换行符'\n'*/ /*当参数replacement作为函数,如下:*/ var str1="fasdd+d<br/>sw<a href="###">w*(</a>*()*"; var re1=/<[^<>]+>/g; document.write(str1.replace(re1,function(s){/*参数s的re1正则匹配的结果*/ var re=/<br\s*\/?>/i; if (re.test(s)){ return "\n";/*把第一个<br/>替换成\n*/ }else{ return ""; } })); </script>
6、常用RegExp 对象方法
test():test() 方法用于检测一个字符串是否匹配某个模式。
{语法:RegExpObject.test(string);参数string:必需,要检测的字符串。}
<script type="text/javascript">
var str = "Visit W3School";
var patt1 = new RegExp("W3School");
var result = patt1.test(str);
/*如果字符串 string 中含有与 RegExpObject 匹配的文本,则返回true,否则返回 false。*/
document.write("Result: " + result);
</script>
例子:(1)、密码强度验证之search()方法
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>密码强度验证之search()方法</title>
<script type="text/javascript">
window.onload=function (){
/*密码强度验证之search()方法*/
var re1=/[0-9]/;
var re2=/[a-z]/;
var re3=/[A-Z]/;
var re4=/[^\w]/;
var arr=[re1,re2,re3,re4];
var num=0;
var text=document.getElementById("text");
text.onkeyup=function(){
var textval=text.value;
num=0;
for (var i = 0; i < arr.length; i++) {
if (textval.search(arr[i])!=-1&&textval.length>4) {
num++;
};
};
if (num==4) {alert("强");return;}
if (num==3) {alert("较强");return;}
if (num==2) {alert("中");return;}
if (num==1) {alert("弱");return;}
}
}
<script />
</head>
<body>
<input type="text" id="text"/>
</body>
</html>
(2)、正则验证昵称
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
//昵称:最少不能少于4位,最大不能大于24位
//输入的内容是不受限
//英文字符:占1位
//中文字符:占2位
window.onload=function (){
var oTxt=document.getElementById("txt1");
var oBtn=document.getElementById("btn1");
oBtn.onclick=function (){
var oTxtValue=oTxt.value;
var re=/[\u4e00-\u9fa5]/g;
var arr=oTxtValue.match(re);
if (re.test(oTxtValue)){
//12的撒
//4+2=6
var maxLength=oTxtValue.length+arr.length;
}else{
var maxLength=oTxtValue.length;
}
if (maxLength>12||maxLength<4){
alert("错误");
}
else{
alert("正确");
}
}
}
</script>
</head>
<body>
<input type="text" id="txt1">
<input type="button" value="验证" id="btn1">
</body>
</html>
(3)、验证邮箱
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
//XXXXXXXXX@qq.com tangcaiye@gmail.com
//XXXXXXXXXX@bokanedu.com
//XXXXXXXXX@163.com
//XXXXXXXXXXX@163.com.org.xx.aa
//数字、字母、_ @ 数字、小写字母{2,8} (.小写字母){1,4}
//^\w+@[0-9a-z]{2,8}(\.[a-z]{2,4}){1,4}$
window.onload=function (){
var oTxt=document.getElementById("txt1");
var oBtn=document.getElementById("btn1");
oBtn.onclick=function (){
var oTxtVlaue=oTxt.value;
var re=/^\w+@[0-9a-z]{2,8}(\.[a-z]{2,4}){1,4}$/;
if (re.test(oTxtVlaue)){
alert("正确");
}else{
alert("错误");
}
}
}
</script>
</head>
<body>
<input type="text" id="txt1">
<input type="button" value="验证" id="btn1">
</body>
</html>