RegExp对象
1,正则表达式有些类似于我们之前接触过的通配符,通过字符模式匹配表达式和值,正则表达式的定义方式有如下两种:
1),var reg = /正则表达式/[附加参数];
2),var reg = new RegExp(“正则表达式”[,“附加参数”]);
简单例子:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-1.8.3.js"></script>
</head>
<body>
<form>
<input type="text" id="score" />
<input type="button" value="提交" />
</form>
<script>
$("[type='button']").bind("click",function(){
var score=$("#score").val();
if(/^(0|[1-9]\d*)$/.test(score)){//如果满足正则表达式/^(0|[1-9]\d*)$/中的规则,则合法。
console.log("合法");
}else{
console.log("非法");
}
});
</script>
</body>
</html>
执行代码,在页面输入纯数字输出如下
关于test方法的解释
test是RegExp的方法,参数是字符串,返回值是boolean类型。
会使用test方法后,下边引入另一个方法,match方法的使用
match是String的方法,参数是正则表达式,返回值是数组
简单例子
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-1.8.3.js"></script>
</head>
<body>
<script>
//match();函数。传入字符串或者正则表达式都可,返回的是数组。控制台输出需要加索引。
var str="hello world";
console.log(str.match(/l/)); //Array[1]
console.log(str.match(/l/)[0]); //1
var str="hello world";
console.log(str.match("wd"));//输出null,加索引后输出wd。
console.log(str.match("ld")[0]); //输出ld。
</script>
</body>
</html>
控制台输出结果如下
正则表达式
附加参数的使用
三类附加参数如下:
附加参数i,g的使用:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-1.8.3.js"></script>
</head>
<body>
<script>
var str="hello world";
var str1=str.match(/l/); //不加g表示只是匹配一次。
for(var i=0;i<str1.length;i++){
console.log(str1[i]);
}
var str="hello world";
var str1=str.match(/l/g); //g表示全局匹配。
for(var i=0;i<str1.length;i++){
console.log(str1[i]);
}
var array="That's hot!".match(/H/i); //i忽略大小写。
for(var i=0;i<array.length;i++){
console.log(array[i]); //h
}
var array="That's hot!".match(/H/);
for(var i=0;i<array.length;i++){
console.log(array[i]);
}
</script>
</body>
</html>
结果如下:
方括号:方括号用于查找某个范围内的字符
下边只验证红色标识的表达式
1,[a-h],[ ^a-h]
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>正则表达式——方括号</title>
<script type="text/javascript">
console.log(/[a-h]/.test("Lucy"));//只要数据中《有一个字符在》a-h范围内,则返回true,所以Lucy符合表达式,Jim不符合
console.log(/[a-h]/.test("Jim"));//false
console.log(/[^a-h]/.test("hi"));//只要数据中《有一个字符不在》a-h范围内,则返回true,所以hi符合表达式,但是ah不符合
console.log(/[^a-h]/.test("ah"));//false
</script>
</head>
<body>
</body>
</html>
2,(red|blue|green)
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>正则表达式——方括号</title>
<script type="text/javascript">
console.log(/(red|blue|green)/.test("It is red."));//只要数据中多个字符可以组成red|blue|green中的一个,则返回true,所以It is red.符合表达式,但是It is black.不符合
console.log(/(red|blue|green)/.test("It is black."));//false
</script>
</head>
<body>
</body>
</html>
元字符(Metacharacter):元字符表示拥有特殊含义的字符
1, . 的使用
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>正则表达式——元字符</title>
<script type="text/javascript">
console.log(/abc./.test("abc#"));//只要数据中多个字符组成的字符串能够构成abcX(X表示某一个字符,换行和行结束符除外),则返回true,所以abc#返回true,而abc返回false
console.log(/abc./.test("abc"));//false
console.log(/abc./.test("abc##"));//true:多个字符组成的字符串构成了abcX。
console.log(/abc./.test("ssssabc##"));//true
</script>
</head>
<body>
</body>
</html>
2,\w,\W的使用
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>正则表达式——元字符</title>
<script type="text/javascript">
console.log(/\w/.test("#a#"));//只要数据中有一个字符在\w范围内,则返回true,所以#a#符合表达式,###不符合。(\w:匹配字母、数字和下划线字符,等价于[A-Za-z0-9_])。
console.log(/\w/.test("###"));//false
console.log(/\W/.test("about "));//只要数据中有一个字符在\W范围内,则返回true,所以"about "符合表达式,有空格,但是"about"不符合,只含字母。
console.log(/\W/.test("about"));//false
console.log(/\w/.test("#_##")); //true,因为加了下划线。
console.log(/\W/.test("###")); //true,含有除了字母、数字和下划线字符之外的字符。
</script>
</head>
<body>
</body>
</html>
3,\0的使用
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>正则表达式——元字符</title>
<script type="text/javascript">
console.log(/\0/.test("about"));//false
console.log(/\0/.test("about \0"));//true
console.log(/\0/.test("about 0"));//true
</script>
</head>
<body>
</body>
</html>
常用量词(注意:m指代某一个字符串)
例子:下边序号按照表中数据顺序列出
1,
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>正则表达式——常用量词</title>
<script type="text/javascript">
if(/(ab+)/.test("about")){//数据必须含有a并且a字符后面紧跟有1个或多个b。必须有ab。
console.log(true);
}else{
console.log(false);
}
var array="That is hot";
console.log(array.match(/h+/g));
console.log(array.match(/h+/));
console.log(array.match(/t +/g)); //["t "]
console.log(array.match(/t+/g)); //必须有t,后边可以不存在匹配的值。
</script>
</head>
<body>
</body>
</html>
2,
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>正则表达式——常用量词</title>
<script type="text/javascript">
if(/(ab*)/.test("wa")){//数据必须含有a,但是a字符后面紧跟的b字符可有可无
console.log(true);
}else{
console.log(false);
}
console.log("waabbbab".match(/(ab*)/g));// "a"; "abbb"; "ab"
console.log("waabbcab".match(/(ab*)/g));//必须有a,但b可以有可以无。*匹配0个或多个。
</script>
</head>
<body>
</body>
</html>
3,
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>正则表达式——常用量词</title>
<script type="text/javascript">
if(/(ab?c)/.test("wabc")){//数据必须含有a并且a字符后面紧跟的b字符要么没有要么只有一个,所以wabbc为false
console.log(true);
}else{
console.log(false);
}
console.log("waabbbab".match(/(ab?)/g)); //?匹配0个或1个。输出a;ab;ab。
console.log("waababcabbab".match(/(ab?)/g)); //输出a;ab;ab;ab;ab。
console.log(/(ab?)/.test("abbcacccab"));
</script>
</head>
<body>
</body>
</html>
4,
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>正则表达式——常用量词</title>
<script type="text/javascript">
if(/(ab{2}c)/.test("wabbc")){//数据必须含有a并且a字符后面紧跟2个b字符,然后b字符后面紧跟一个c
console.log(true);
}else{
console.log(false);
}
console.log(/(ab{2}c)/.test("wabbc"));//true;
console.log("wabbc".match(/ab{2}c/));//abbc
console.log("wabbbc".match(/ab{2}/));
</script>
</head>
<body>
</body>
</html>
5,
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>正则表达式——常用量词</title>
<script type="text/javascript">
if(/(ab{2,5}c)/.test("wabbbbbc")){//数据必须含有a并且a字符后面紧跟2-5个b字符(不能大于5,不能小于2),然后b字符后面紧跟一个c,所以wabbbbbbc为false
console.log(true);
}else{
console.log(false);
}
console.log("wabbbbbc".match(/(ab{2,5}c)/));
console.log("wabbbbbbbbbbbc".match(/(ab{2,5})/));
</script>
</head>
<body>
</body>
</html>
6,
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>正则表达式——常用量词</title>
<script type="text/javascript">
if(/(ab{2,}c)/.test("wabbbbc")){//数据必须含有a并且a字符后面紧跟2个或2个以上的b字符,然后b字符后面紧跟一个c,所以wabc为false
console.log(true);
}else{
console.log(false);
}
console.log("wabc".match(/(ab{2,}c)/));//null
console.log("wabbbbbc".match(/(ab{2,}c)/));
console.log("wabbbbbbbbbbbc".match(/(ab{2,})/));
</script>
</head>
<body>
</body>
</html>
7,
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>正则表达式——常用量词</title>
<script type="text/javascript">
if(/^ab/.test("abc")){//数据必须以ab开头,所以wabc为false
console.log(true);
}else{
console.log(false);
}
console.log(/^ab/.test("abc"));
</script>
</head>
<body>
</body>
</html>
8,
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title>正则表达式——常用量词</title>
<script type="text/javascript">
if(/ab$/.test("cab")){//数据必须以ab结尾,所以wabc为false
console.log(true);
}else{
console.log(false);
}
</script>
</head>
<body>
</body>
</html>