正则表达式

来源:互联网 发布:淘宝店铺如何取消分流 编辑:程序博客网 时间:2024/06/03 17:22

定义正则表达式:


<!DOCTYPE html><html>   <head>      <meta charset="UTF-8">      <title>正则表达式普通方式</title>      <script type="text/javascript">         window.onload=function() {            document.getElementById('form').onsubmit=function() {               //提交监听事件               //1普通方式声明一个正则表达式               var reg=/white/i;//i:忽略大小写               //2使用构造函数声明一个正则表达式//             var reg=new RegExp('white');
             //普通方式声明一个正则表达式             var reg=/a/ig;//i:不区分大小写,aA全都充当分隔符.g代表全局匹配
//验证输入框内容是否匹配
                 var a=document.getElementById('a').value;       
               if(reg.test(a)) {             
              //验证通过    
                 alert('验证通过') 
              } else {  
                //验证失败  
                alert('验证失败')               }
             //验证输入框内容是否匹配             var a=document.getElementById('a').value;
            //通过正则表达式规则去替换一个字符串            var b=a.replace(reg,'b');
           //通过value属性修改输入框的值            var input=document.getElementById('a');            input.value=b;
//通过正则表达式规则去分割一个字符串
          var arr=a.split(reg);
             for(var i=0;i<arr.length;i++) {
                alert(arr[i]);
                }
return false;
            } 
        }     
 </script> 
  </head>
   <body>
      <form id="form" action="" method="post">
         <!--文本输入框--> 
        <input type="text" id="a" value="" />
         <input type="submit" value="登录"/> 
     </form>
   </body>
</html>
RegExp对象:
exec方法:
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title></title>    <script>        window.onload=function(){            var str='you are a boy';            var reg=new RegExp('o','g');//g:全局匹配            //lastI搜索的字符下标的起始位置,默认为0            reg.lastIndex=3;            //匹配正则,返回一个数组           console.log(reg.exec(str));//结果:index(下标)        }    </script></head><body></body></html>
结果如图:
search方法:
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title></title>    <script>        var str='hello world';        var reg=/o/;//var reg=/o/g即便匹配全局也没有效果,返回的依然是第一个匹配值的下标索引        //返回的是第一个匹配值的下标索引        console.log(str.search(reg))    </script></head><body></body></html>
结果如图:
match方法:
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title></title>    <script>        var str='hello world';        var reg=/o/g;        //字符串匹配正则表达式,返回的是匹配到的结果数组        console.log(str.match(reg));    </script></head><body></body></html>
结果如图:
(得到的数组)
(数组的具体展示)
test方法:
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title></title>    <script>        window.onload=function(){            var str='you are a boy';            var reg=new RegExp('o','g');//g:全局匹配            //test() 方法检索字符串中的指定值。返回值是 true  false           console.log(reg.test(str));        }    </script></head><body></body></html>
结果如图:
由于该字符串中存在字母 "o",所以以上代码的输出的是:true
<!DOCTYPE html><html>   <head>      <meta charset="UTF-8">      <title></title>      <script type="text/javascript">         var str='you are a boy';         var reg=new RegExp('o','g');         //匹配正则返回一个数组         //lastIndex是搜索的字符下标起始位置         reg.lastIndex=0;         console.log(reg.exec(str));         console.log(reg.exec(str));         console.log(reg.exec(str));         console.log(reg.exec(str));      </script>   </head>   <body>   </body></html>
结果如图:
(共匹配到两个o,那第三个console则为null,
                                  此三个构成一个循环显示在控制台上,如若匹配到三个o,则第四个console为null)

正则表达式的常用符号:
操作练习:
<script>
//匹配年龄在0-120之间var age='180'; var reg=/^(1[0-1]|[1-9])?\d$|^120$/; alert(reg.test(age)?'匹配成功':'匹配失败');
</script>

<script>
//密码只能有英文字母和数字组成,长度为4-10var password='aaa-123';var reg=/^[a-zA-Z0-9]{4,10}$/;alert(reg.test(password)?'匹配成功':'匹配失败');
</script>

<script>
//用户名只能用英文字母和数字组成,第一位只能由英文字母组成,长度4-16var name='a12345';var err='110';var reg=/^[a-zA-Z][A-Za-z0-9]{4,16}$/;alert(re.test(na));
</script>

<script>
 //生日的年份子啊1900-2009之间,生日的格式为1980-5-121988-05-04的形式 var birth='1996-09-18'; var reg=/^(19\d{2}|200\d)-(0?[1-9]|1[0-2])-(0?[1-9]|[1-2]\d|3[0-1])$/;alert(reg.test(birth)?'匹配成功':'匹配失败');
</script>