正则表达式[JavaScript+PHP]
1. 正则表达式的应用
1.表单验证
2.信息过滤
3.信息采集—>爬虫
4.信息替换
5.页面伪静态的规则
//正则基本语法
var result = str.match(/参数就是正则表达式/g); //返回包含匹配结果的数组或者null
//正则表达式前后的 斜杠/ 叫做定界符,是固定格式。
//g是global,表示全局的意思,它是正则表达式语法中的修饰符,修饰符应该放到定界符(/)的后面。
2.正则语法-元字符
元字符:一些具有特殊含义的特殊字符
普通字符:包括所有大写和小写字母,所有数字,所有标点符号和一些其他符号
2.1 限定符
限定符(量词)用来指定正则表达式的一个给定组件必须要出现多少次才能满足匹配。有 * 或 + 或 ? 或 {n} 或 {n,} 或 {n,m} 共6种。
* | 匹配前面的子表达式零次或多次。例如,zo* 能匹配 “z” 以及 “zoo”。* 等价于{0,}。 |
---|---|
+ | 匹配前面的子表达式一次或多次。例如,‘zo+’ 能匹配 “zo” 以及 “zoo”,但不能匹配 “z”。+ 等价于 {1,}。 |
? | 匹配前面的子表达式零次或一次。例如,“do(es)?” 可以匹配 “do” 、 “does” 中的 “does” 、 “doxy” 中的 “do” 。? 等价于 {0,1}。 |
{n} | n 是一个非负整数。匹配确定的 n 次。例如,‘o{2}’ 不能匹配 “Bob” 中的 ‘o’,但是能匹配 “food” 中的两个 o。 |
{n,} | n 是一个非负整数。至少匹配n 次。例如,‘o{2,}’ 不能匹配 “Bob” 中的 ‘o’,但能匹配 “foooood” 中的所有 o。‘o{1,}’ 等价于 ‘o+’。‘o{0,}’ 则等价于 ‘o*’。 |
{n,m} | m 和 n 均为非负整数,其中n <= m。最少匹配 n 次且最多匹配 m 次。例如,“o{1,3}” 将匹配 “fooooood” 中的前三个 o。‘o{0,1}’ 等价于 ‘o?’。请注意在逗号和两个数之间不能有空格。 |
贪婪匹配与非贪婪匹配
默认情况下,正则表达式执行贪婪匹配(尽可能取多的情况)
非贪婪匹配:相对于贪婪匹配来说—>设置方式:将?加在其他限定符之后。
非贪婪匹配使用场景举例:<div><div>abc</div>
var str1 = 'FateGrandOrder';
var res1 = str1.match(/a+?/g);//+后面有?执行非贪婪匹配
console.log(res1);//(2) ["a", "a"]
2.2 等价符
. | 匹配除换行符(\n、\r)之外的任何单个字符。要匹配包括 ‘\n’ 在内的任何字符,请使用像"(.|\n)"的模式。 |
---|---|
\d | 匹配一个数字字符。等价于 [0-9]。 |
\D | 匹配一个非数字字符。等价于 [^0-9]。 |
\w | 匹配字母、数字、下划线。等价于’[A-Za-z0-9_]’。 |
\W | 匹配非字母、数字、下划线。等价于 ‘[^A-Za-z0-9_]’。 |
\s | 匹配任何空白字符,包括空格、制表符、换页符等等。等价于 [ \f\n\r\t\v]。 |
\S | 匹配任何非空白字符。等价于 [^ \f\n\r\t\v]。 |
\n | 匹配一个换行符。等价于 \x0a 和 \cJ。 |
\r | 匹配一个回车符。等价于 \x0d 和 \cM。 |
\t | 匹配一个制表符。等价于 \x09 和 \cI。 |
var str2 = 'FateGrandOrder2.0';
var res2 = str2.match(/\d+/g);//匹配所有的数字
console.log(res2);//(2) ["2", "0"]
2.3 定位符
定位符用来描述字符串或单词的边界,
^
和$
分别指字符串的开始和结束,\b
描述单词的前或后边界,\B
表示非单词边界。
^ | 匹配输入字符串开始的位置。如果设置了 RegExp 对象的 Multiline 属性,^ 还会与 \n 或 \r 之后的位置匹配。 |
---|---|
$ | 匹配输入字符串结尾的位置。如果设置了RegExp 对象的Multiline 属性,$ 还会与 \n 或 \r 之前的位置匹配。 |
\b | 匹配一个单词边界,也就是指单词和空格间的位置。例如, ‘er\b’ 可以匹配"never" 中的 ‘er’,但不能匹配 “verb” 中的 ‘er’。 |
\B | 匹配非单词边界。‘er\B’ 能匹配 “verb” 中的 ‘er’,但不能匹配 “never” 中的 ‘er’。 |
var str3 = 'FateGrandOrder2.0';
var res3 = str3.match(/^.+$/);//匹配整个字符串
console.log(res3);//["FateGrandOrder2.0", index: 0, input: "FateGrandOrder2.0", groups: undefined]
2.4 字符簇(方括号)
方括号表示一个范围,也称为字符簇,匹配满足条件的一个字符
[xyz] | 字符集合。匹配所包含的任意一个字符。例如, ‘[abc]’ 可以匹配 “plain” 中的 ‘a’。 |
---|---|
[^xyz] | 负值字符集合。匹配未包含的任意字符。例如, ‘[^abc]’ 可以匹配 “plain” 中的’p’、‘l’、‘i’、‘n’。 |
[a-z] | 字符范围。匹配指定范围内的任意字符。例如,’[a-z]’ 可以匹配 ‘a’ 到 ‘z’ 范围内的任意小写字母字符。 |
[^a-z] | 负值字符范围。匹配任何不在指定范围内的任意字符。例如,’[^a-z]’ 可以匹配任何不在 ‘a’ 到 ‘z’ 范围内的任意字符。 |
x|y | 匹配 x 或 y。例如,‘z|food’ 能匹配 “z” 或 “food”。’(z|f)ood’ 则匹配 “zood” 或 “food”。 |
//示例:
//[0-9] 查找任何从 0 至 9 的一个数字。
//[a-z] 查找任何从小写 a 到小写 z 的字符。
//[A-Z] 查找任何从大写 A 到大写 Z 的字符。
//[A-z] 查找任何从大写 A 到小写 z 的字符。包括下划线。 A- Z _ a -z
//[A-Z|a-z] [A-Za-z]查找任何从大写 A 到小写 z 的字符,不包括下划线。
var str4 = 'FateGrandOrder2.0';
var res4 = str4.match(/[a-z]+/g);//匹配所有的小写字母
console.log(res4);//(3) ["ate", "rand", "rder"]
2.5 修饰符
修饰符的用法,修饰符一定要写到正则表达式末尾/之后,可以一次性使用多个修饰符。
i 执行对大小写不敏感的匹配。实际上就是不区分大小写的匹配(默认区分大小写)
g 执行全局匹配(查找所有匹配而非在找到第一个匹配后结束)
m 执行多行匹配(^和$能匹配每行的开始和结束)
var str5 = 'FateGrandOrder\n1\n2';
var res5 = str5.match(/[a-z]+/gi);// /i的用法-->匹配所有的字幕字符串(不区分大小写)
var resc = str5.match(/^\d+$/gm);// /m的用法-->匹配整个数字字符串
console.log(res5);//["FateGrandOrder"]
console.log(resc);//["1", "2"]
2.6 转义字符
\ | 将下一个字符标记为一个特殊字符、或一个原义字符、或一个 向后引用、或一个八进制转义符。例如,‘n’ 匹配字符 “n”。’\n’ 匹配一个换行符。序列 ‘\’ 匹配 “” 而 “(” 则匹配 “(”。 |
---|
如果匹配的字符串在正则中有特殊含义的都必须加转义字符。如:
[]
$
.
*
?
+
|
^
{}
()
var str6 = 'FateGrandOrder2.0';
var res6 = str6.match(/\d\.\d/g);//转义字符
console.log(res6);//["2.0"]
//匹配图片路径
var str7 = 'FateGrandOrder.png';
var res7 = str7.match(/.*(\.jpg|png|gif)/g);
console.log(res7);//["FateGrandOrder.png"]
3.JS中的正则对象
3.1 正则对象的定义
正则对象两种定义方式:js中正则表达式两边不用加引号
var pattern = /[a-z]/;//将正则表达式直接当做对象使用。
var pattern = new RegExp(/[a-z]/);//实例化RegExp对象
3.2 正则对象的方法
3.2.1 test方法
test方法检测目标字符串和正则表达式是否匹配,如果匹配返回true,不匹配返回false。正则表达式中,一般不需要加全局修饰符g。
var str='1.0FateGrandOrder';
var pattern=new RegExp(/^\d\.+[a-z]|[0-9]/);//声明正则对象--->以数字开头
console.log(pattern);// /^\d\.+[a-z]|[0-9]/
console.log(typeof pattern);//object
console.log(pattern.test(str));//正则对象的test方法--->返回值为bool类型
//true
3.2.2 exec方法
exec方法执行一个正则匹配,只匹配一次,匹配到结果就返回一个数组类型的结果,匹配不到就返回null。
正则表达式中,一般不需要加全局修饰符g。
即使正则表达式中,使用了全局匹配修饰符g,也只匹配一次。
var str='1.0FateGrandOrder';
var pattern=new RegExp(/^\d\.+[a-z]|[0-9]/);//声明正则对象--->以数字开头
console.log(pattern.exec(str));//正则对象的exec方法[只匹配一次--->匹配返回一个数组,不匹配返回false
//["1", index: 0, input: "1.0FateGrandOrder", groups: undefined]
3.3.3 lastIndex 属性
表示正则表达式,上一次匹配结束后的位置(目标字符串中的索引),即下一次匹配开始的位置。
lastIndex是一个整数,。没有更多匹配重置lastIndex为0.
test 方法和exec方法默认都只匹配一次。匹配后lastIndex 被自动重置为0.
特殊情况:如果正则表达式使用了全局匹配修饰符
g
,则lastIndex不会被重置为0.
var str = 'php1js22';
//var pattern = /[a-z]/;//匹配小写字母字符串
var pattern = /[a-z]/g;//全局匹配小写字母字符串
var res1 = pattern.exec(str);
console.log(res1);//["p"] 只匹配一次,返回数组
console.log(pattern.lastIndex);//1 下一次匹配开始的位置
var res2 = pattern.exec(str);
console.log(res2);//["h"] //从位置1开始匹配
4.分组/捕获和反向作用
**分组/捕获:**正则中出现的小括号就叫做捕获或者分组,括号里面的表达式,通常也叫做子表达式。
在正则语法中,用“\1”来引用前面的捕获(使用子表达式匹配的结果)。用\2表示第二个捕获的内容….
在正则语法外(如replace时),用“$1”来引用前面的捕获。
var str8 = '1122 3434 5566 7879 9887';
var res8 = str8.match(/(\d)\1(\d)\2/g);//匹配连续四个数字,第一个和第二个数字相同,第三个和第四个数字相同
console.log(res8);//(2) ["1122", "5566"]
var res81 = str8.match(/(\d)(\d)\1\2/g);//匹配连续四个数字,第一个和第三个数字相同,第二个和第四个数字相同
console.log(res81);//["3434"]
var res82 = str8.match(/(\d)\d\1/g);//匹配连续四个数字,第一个和第三个数字相同
console.log(res82);//(2) ["343", "787"]
var res83 = str8.replace(/(\d)\1(\d)\2/g, '$1$2');//匹配连续四个数字,第一个和第二个数字相同,第三个和第四个数字相同,并将相同的数字只保留一个
console.log(res83);//12 3434 56 7879 9887
禁止引用: (?:正则)这个小括号中的内容不能够被引用
var str8 = '1122 3434 5566 7879 9887';
var res84 = str8.match(/(?:\d)(\d)\1\d/g);//第一次禁止引用
console.log(res84)//["9887"]
5.匹配中文
每个字符(中文、英文字母、数字、各种符号、拉丁文、韩文、日文等)都对应着一个Unicode编码。
查看Unicode编码,找到中文的部分,然后获取中文的Unicode编码的区间,就可以用正则匹配了。
前面我们用[a-z]表示小写字母,[0-9]表示数字,这就是一个范围表示,如果有一个数x能够表示第一个中文,有一个数y能够表示最后一个中文,那么[x-y]就可以表示所有的中文了。
中文的Unicode编码从4E00开始,到9FA5结束。
[\u4E00-\u9FA5]这个区间就能够表示中文。
var str = "你好,世界";
var res = str.match(/[\u4E00-\u9FA5]/g);
console.log(res);//Array(4) 0: "你" 1: "好" 2: "世" 3: "界" length: 4 __proto__: Array(0)
案例:解决结巴程序(即:消除重复字符)
把“早早早早早上上上上上好好好好好好好好”字符串换成单字的形式,即“早上好”;
核心思想:匹配到重复的字符时,保留一个。
var str = '早早早早早上上上上上好好好好好好好好';
var res = str.replace(/([\u4E00-\u9FA5])\1+/g,'$1');
console.log(res);//早上好
6.环视(预查/断言/零宽断言)
正则表达式中,用于查找某些内容之前或者之后的东西,叫做环视。
环视通常也叫做预查、断言或者零宽断言。
6.1 正向肯定预查(顺序肯定环视)
every(?=n)匹配后面任何紧跟的指定字符串n的字符串。
//匹配后面字符为10的windows
var str = "windows7 windows8 windows10"
alert("win9斩华雄!");
var res = str.match(/windows(?=10)/g);
console.log(res);//["windows", index: 18, input: "windows7 windows8 windows10", groups: undefined]
6.2 正向否定预查(顺序否定环视)
every(?!n)匹配任何其后没有紧接指定字符串n的字符串。
//匹配后面字符不是10的windows
var str = "windows7 windows8 windows10"
alert("win9斩华雄!");
var res = str.match(/windows(?!10)/g);
console.log(res);//(2) ["windows", "windows"]
另外,还会看到(?!B)[A-Z]这种写法,其实它是[A-Z]范围里,排除B的意思,前置的(?!B)只是对后面数据的一个限定,从而达到过滤匹配的效果。
var str = "abcd1234";
var res = str.match(/(?!c)[a-z]/g);
console.log(res);//(3) ["a", "b", "d"]
7.支持正则表达式的String对象的方法
7.1 stringObj.match(regex)
在字符串中检索匹配正则表达式regex的子串;
如果匹配,返回包含匹配结果的一个数组;不匹配返回null。
正则表达式regex中不带全局修饰符g,则只匹配一次。
正则表达式regex中带全局修饰符g,则匹配所有结果。
var str = "sherlockholmes2329@gamil.com";
var res = str.match(/[@\.]/g);// .要加转义字符
console.log(res);//(2) ["@", "."]
7.2 stringObj.replace(regex,replacement)
在字符串中检索匹配正则表达式regex的子串,并替换为指定的字符串replacement;
返回替换之后的新字符串。
正则表达式regex中不带全局修饰符g,则只匹配一次并替换一次。
正则表达式regex中带全局修饰符g,则匹配所有结果并替换所有结果。
替换的时候,使用"$1"表示匹配的第一个子表达式;
用$2表示第二个子表达式,以此类推。
var str = "Fate/StayNight";
var res = str.match(/S+\w+/,'GrandOrder');
console.log(res);//Fate/GrandOrder
7.3 stringObj.search(regex)
在字符串中搜索符合正则表达式的结果。如果找到结果返回结果的起始位置,停止向后检索,也就是说忽略全局标识符g;如果没有匹配结果,返回-1.
var str = 'sherlockholmes2329@gmail.com';
var res = str.search(/[@\.]/);
console.log(res);//18
7.4 stringObj.split(regex)
把一个字符串分割为字符串数组,返回一个数组。
var str = 'sherlockholmes2329@gmail.com';
var res = str.split(/[@\.]/);//要加转义字符
console.log(res);//(3) ["sherlockholmes2329", "gmail", "com"]
总结
正则对象.test(str) 返回 true false
正则对象.exec(str) 只匹配一次 返回 数组 null
字符串对象.match(正则) 返回 数组 null 有全局g匹配多次,否则匹配一次
字符串对象.replace(正则, str) 返回新的字符串 有全局替换多次,否则替换一次
字符串对象.search(正则) 返回开始位置下标 不匹配返回-1
字符串对象.split(正则) 返回数组
8.PHP中的正则表达式
语法和JavaScript中的正则语法基本一致。
PHP中的正则函数:(php手册–函数参考–文本处理–PCRE–PCRE函数)
8.1 preg_match()
//语法
preg_match (string $pattern, string $subject [, array &$matches])
执行一次正则表达式的匹配,返回匹配的次数(0或者1)
参数:
$pattern : 字符串格式的正则表达式
$subject : 目标字符串
$matches : 结果数组。
如果提供了参数matches,它将被填充为搜索结果。 $matches[0]将包含完整模式匹配到的文本, $matches[1] 将包含第一个捕获子组匹配到的文本,以此类推。
<?php
$str = 'sherlockholmes2329@gmail.com';
//执行一次匹配
$res = preg_match('/[@\.]/', $str, $matches);
var_dump($matches);//array(1) { [0]=> string(1) "@" }
8.2 preg_match_all()
//语法
preg_match_all(string $pattern,string $subject [,array&$matches])
执行正则表达式的全局匹配。返回完整匹配次数(可能是0)
参数含义和preg_match相似。$matches[0]将包含完整模式匹配到的结果,是一个数组。
<?php
$str = 'sherlockholmes2329@gmail.com';
//全局匹配
$res = preg_match_all('/[@\.]/', $str, $matches);
var_dump($matches);//array(1) { [0]=> array(2) { [0]=> string(1) "@" [1]=> string(1) "." } }
8.3 preg_replace()
//语法
preg_replace ( mixed $pattern , mixed $replacement , mixed $subject)
执行一个正则表达式的搜索和替换。返回替换后的结果。
如果$subject是一个数组, preg_replace()返回一个数组,其他情况下返回替换后的字符串.
参数:
$pattern : 字符串格式的正则表达式或正则表达式数组
$replacement : 用于替换的字符串或数组
$subject : 目标字符串或数组。
//查找并替换
$str = 'sherlockholmes2329@gmail.com';
$res = preg_replace('/[@\.]/', '$', $str);
var_dump($res);//string(28) "sherlockholmes2329$gmail$com"
//执行查找并替换(数组)
$arr = ['sherlockholmes2329@gmail.com', '1986446882@qq.com'];
$res = preg_replace('/[@\.]/', '$', $arr);
var_dump($res);//array(2) { [0]=> string(28) "sherlockholmes2329$gmail$com" [1]=> string(17) "1986446882$qq$com" }
解决贪婪问题?(php中和js中一致)
默认正则中都是贪婪匹配。
php中正则也可以在限定符后面加上? 表示非贪婪匹配。
8.4 PHP中使用正则的注意点
PHP中的使用正则的使用除了//以外,外面还要加引号。
PHP中的正则表达式需要加引号。
如果加的是双引号,正则表达式中使用反向引用时,\1 \2等需要写为\\1 [\\2](file://2) ,表示对\转义。
实例
请用学过的知识对各个表单项进行验证。
要求:
1、各个表单项不能为空
2、用户名必须由小写字母和数字组成,但不能以数字开头,不能少于4位
3、密码不少于4位,两次密码必须一致
4、手机号必须是11位数字,并且必须以1开头
5、提交表单时进行验证,如果表单中的各个项都验证通过则允许表单提交;如果有未通过验证的项,则不允许表单提交。
提示1:
当用户提交表单时,依次检测各项,如果满足条件则不作处理,让表单提交,如果不满足其中任何一项,则阻止表单提交。
提示2:
阻止表单提交可以使用JavaScript事件对象中的阻止默认行为方法,也可以简单的使用return false。
<head>
<style type="text/css">
span{
color: red;
}
</style>
</head>
<body>
<h2 align="center">注册</h2>
<form name="form1" onSubmit="return subSheck();" action="register.php" method="post">
<table border="1" cellspacing="0" cellpadding="2" rules="all" align="center" width="70%">
<tr>
<td align="right">用户名:</td>
<td>
<input type="text" name="username" id="username" onkeyup="f1()"><!-- onkeyup 事件会在键盘按键被松开时发生 -->
<span></span>
</td>
</tr>
<tr>
<td align="right">密码:</td>
<td>
<input type="password" name="pwd" id="pwd" onmouseleave="f2()">
<span></span>
</td>
</tr>
<tr>
<td align="right">重复密码:</td>
<td>
<input type="password" name="repwd" id="repwd" onmouseleave="f3()">
<span></span>
</td>
</tr>
<tr>
<td align="right">手机号:</td>
<td>
<input type="text" name="tel" id="tel" onmouseleave="f4()">
<span></span>
</td>
</tr>
<tr>
<td align="center" colspan="2"><input type="submit" id="submit" value="注册"></td>
</tr>
</table>
</form>
<script>
//事件绑定在input标签内
//用户名验证
var user = document.getElementById('username');
//正则表达式
var re = /^(?![0-9]+$)(?![a-z]+$)(?!\d)[a-z0-9]{4,}/;
//(?![0-9]+$)预测该位置后面不全是数字
//(?![a-z]+$)预测该位置后面不全是字母
//(?!\d)预测该位置不能是数字
//绑定鼠标离开事件
function f1(){
if (user.value=="") {
user.nextElementSibling.innerHTML='用户名不能为空!';
return false;
}else if(!re.test(user.value)){
user.nextElementSibling.innerHTML='用户名不合法!';
return false;
}else{
user.nextElementSibling.innerHTML='';
return true;
}
}
//密码验证
var password = document.getElementById('pwd');
//绑定鼠标离开事件
function f2(){
if (password.value=="") {
password.nextElementSibling.innerHTML='密码不能为空!';
return false;
}else if(password.value.length<4){
password.nextElementSibling.innerHTML='密码必须大于4位!';
return false;
}else{
password.nextElementSibling.innerHTML='';
return true;
}
}
//第二次输入密码验证
var repwd = document.getElementById('repwd');
function f3(){
if (repwd.value=="") {
repwd.nextElementSibling.innerHTML='密码不能为空!';
return false;
}else if(repwd.value!=password.value){
repwd.nextElementSibling.innerHTML='两次输入密码不一致!';
return false;
}else{
repwd.nextElementSibling.innerHTML='';
return true;
}
}
//手机号验证
var tel = document.getElementById('tel');
//正则表达式
var telre = /^1+[3-8]\d{9}$/;
function f4(){
if (tel.value=="") {
tel.nextElementSibling.innerHTML='手机号码不能为空!';
return false;
}else if(!telre.test(tel.value)){
tel.nextElementSibling.innerHTML='手机号码不合法!';
return false;
}else{
tel.nextElementSibling.innerHTML='';
return true;
}
}
//检测是否阻止提交
function subSheck(){
//调用再检查一遍
f1();
f2();
f3();
f4();
// console.log(2233);
// console.log(f1(),f2(),f3(),f4());
// return false;
//测试代码
if (f1() == true&&f2() == true&&f3() == true&&f4() == true) {
console.log(f1(),f2(),f3(),f4());
alert("注册成功");
return true;
}else{
alert("请检查注册信息!");
return false;
}
}
</script>
</body>
扩展:
密码由数字和字母组成,并且要同时含有数字和字母,且长度要在8-16位之间。
var pattern = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{8,16}$/
分开来注释一下:
^ 匹配一行的开头位置
(?![0-9]+$) 预测该位置后面不全是数字
(?![a-zA-Z]+$) 预测该位置后面不全是字母
[0-9A-Za-z] {8,16} 由8-16位数字或这字母组成
$ 匹配行结尾位置
注:(?!xxxx) 是正则表达式的负向零宽断言一种形式,标识预该位置后不是xxxx字符。手机号检测正则表达式
手机号特点:11位,纯数字,1开头, [23位号段,具体咨询各大运营商]
简单版(限制前两位):1开头,第二位3-9,后面9位数字
var pattern = /^1[3-9]\d{9}$/
精确版(限制前三位):(如果出现新的手机号段,则不适用,需更新)
示例:
13[0-9]开头、14[579]开头、15[0-3,5-9]开头、166开头、17[0135678]开头、18[0-9]开头、19[89]开头
var pattern = /^1(3[0-9]|4[579]|5[0-3,5-9]|6[6]|7[0135678]|8[0-9]|9[89])\d{8}$/
邮箱格式检测正则表达式
邮箱特点:
通用的邮箱的特点:
简单版:必须有@
var pattern = /@/;
精确版:
必须有@和.
@前面是邮箱名,要求至少一个字符,要求是数字、字母、下划线、[还可以用.-],但是开头必须是数字字母下划线
@和点之间:是一个域名,要求至少一个字符,可以是数字字母中横线,要求开头是数字或字母
点后面:要求是至少一个字符,必须是字母
点xxx,这部分可以出现一次,也可以出现多次
最后一个点后面,字符长度为2-6的字母
var pattern = /^\w[\w\.-]*@[0-9a-z][0-9a-z-]*(\.[a-z]+)*\.[a-z]{2,6}$/i;
onmouseleave与onmouseout区别
1、onmouseleave、onmouseenter,鼠标进入到指定元素区域内触发事件,不支持冒泡,不包含子元素的区域。
2、onmouseout、onmouseover、鼠标进入指定元素触发事件,含子元素区域。
附加:jQuery中的子元素选择器find与children区别。
find是筛选出当前元素下的所有(儿子元素,孙子元素等)符合条件的元素。
children是筛选出当前元素下的直接子元素(儿子元素)。