正则表达式是一组独立的规则，几乎每个编程语言都提供了实现这些规则的类
1、两种方式创建正则对象
第一种创建方式：
var reg = new RegExp(pattern,flags);
第二种创建方式（推荐使用）：
var reg = /pattern/flags;//flags如果为g，表示全局匹配，如果为i，表示忽略大小写
2、两个常用方法
| 方法 | 作用 |
| test() |
测试一段文本是否和此正则表达式匹配 检索字符串中的指定值。返回值是 true 或 false。 |
| exec() |
可获得一段文本中和正则匹配的部分（返回值是一个数组或者null） 返回值是被找到的值。如果没有发现匹配，则返回 null。 |
3、示例
(1)找出各个匹配的项
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>Javascript测试</title>
<script type="text/javascript">
var str = "abceefabc";
var reg = /bc/g;
var arr;
while(arr = reg.exec(str)){
alert(arr.index + ":" + arr[0]);
}
</script>
</head>
<body>
</body>
</html>
效果图
(2)查找出所有手机号码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>Javascript测试</title>
<script type="text/javascript">
var msg = "中国移动：10086，中国联通：10010，中国电信：10000";
var reg = /\d{5}/g;
var result;
while(result=reg.exec(msg))
{
alert(result);
}
</script>
</head>
<body>
</body>
</html>
效果图
(3)进行全部替换
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <title>Javascript测试</title> <script type="text/javascript"> var str = "abceefabc"; var reg = /bc/g; var result = str.replace(reg,‘KK‘); alert(result);//aKKeefaKK </script> </head> <body> </body> </html>
效果图
(4)验证邮箱格式
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>Javascript测试</title>
<style type="text/css">
.cls{
color:gray;
}
</style>
<script type="text/javascript">
onload=function(){
var txtObj = document.getElementById(‘txt‘);
var defaultContent = "请输入邮箱进行验证";
txtObj.onfocus=function(){
if((this.value == defaultContent) && (this.className=="cls"))
{
this.value = "";
this.className = "";
}
};
txtObj.onblur=function(){
var txtValue = this.value;
if(txtValue.length>0)//如果文本框中有内容，就检查输入的字符串是否是正确的邮箱格式
{
var reg = /^[0-9a-zA-Z_-][email protected][a-zA-Z-0-9]+(\.[a-zA-Z]+){1,2}$/;
if(reg.test(txtValue)){
document.getElementById(‘msg‘).innerText = "邮箱格式正确";
document.getElementById(‘msg‘).style.color = "green";
}
else
{
document.getElementById(‘msg‘).innerText = "邮箱格式不正确";
document.getElementById(‘msg‘).style.color = "red";
}
}
else//如果文本框中没有内容，就提示用户输入邮箱：“请输入邮箱进行验证”
{
this.value = "请输入邮箱进行验证";
this.className = "cls";
document.getElementById(‘msg‘).innerText = "";
document.getElementById(‘msg‘).style.color = "";
}
};
};
</script>
</head>
<body>
<label for="txt">请输入邮箱：</label>
<input class="cls" type="text" id="txt" value="请输入邮箱进行验证" style="width:300px;height:30px;font-size:20px;"/>
<label id="msg"></label>
</body>
</html>
效果图
时间： 2024-11-07 04:33:25