js正则表达式的使用详解


Posted in Javascript onJuly 09, 2013

js中的正则表达式比起C#中的正则表达式要弱很多,但基本够用了
1定义正则表达式
2关于验证的三个这则表达式方法
3正则表达式式的转义字符

1定义正则表达式
在js中定义正则表达式很简单,有两种方式,一种是通过构造函数,一种是通过//,也就是两个斜杠。
例如

  var   re =new RegExp("\\?(\\w{1,}=\\w{1,}&){1,}\\w{1,}=\\w{1,}");

使用构造函数定义正则表达式,注意大小写,负责就会不起作用。由于构造函数的参数是一个字符串,也可以是两个斜杠的方式定义,遇到一些特殊字符就需要使用\进行转义
通过双斜杠的方式定义同样的正则表达式
var   re =/\?(\w{1,}=\w{1,}&){1,}\w{1,}=\w{1,}/;

var re =new RegExp( /^\?(\w{1,}=\w{1,}&){1,}\w{1,}=\w{1,}/);

可以和构造函数达到同样的效果,但仔细分析,发现,通过构造函数需要更多的转义字符\

2关于验证的三个正则表达式方法

使用正则表达式的主要有字符串的方法match,正则表达式的方法exec,test
正则表达式方法test测试给定的字符串是否满足正则表达式,返回值是bool类型的,只有真和假,如果只是单纯的判断,不需要其他的处理,可以使用尤其是验证时。
 function test(){ 
    var text="index.aspx?test=1&ww=2&www=3"; //    
      var   re =/\?(\w{1,}=\w{1,}&){1,}\w{1,}=\w{1,}/;
    //  var   re =new RegExp("\\?(\\w{1,}=\\w{1,}&){1,}\\w{1,}=\\w{1,}");
        var result=  re.test(text);
     if(result)
     {
        alert("ok");   
     }else
     {
      alert("err");  
     }                       }

正则表达式方法exec测试给定的字符串是否满足正则表达式,返回匹配到的字符串,如果没有匹配的则返回null,和test基本一致,如果需要获取匹配的各个子字符串,可以使用下标的方式,把上边的test的例子可以改写如下
 function test(){ 
   var text="index.aspx?test=1&ww=2&www=3";
            var   re = /\?(\w{1,}=\w{1,}&){1,}\w{1,}=\w{1,}/;
   //  var   re =new RegExp( "\\?(\\w{1,}=\\w{1,}&){1,}\\w{1,}=\\w{1,}");
        var result=  re.exec(text); 
      if(result)
     {
           alert("ok"); 
                          alert(result);  // 是?test=1&ww=2&www=3,ww=2&     
            alert(result[0]+",0");//是?test=1&ww=2&www=3
     alert(result[1]+",1");//是ww=2&     
     }else
     {
      alert("err");  
     }         }

match其实是字符串的方法,但参数确是一个正则表达式,把上边的例子改写后,如下
 function test(){ 
    var text="index.aspx?test=1&ww=234"; //
          var   re = /\?(\w{1,}=\w{1,}&){1,}\w{1,}=\w{1,}/;
     //   var   re2 = "(\\w{1,}=\\w{1,}&){1,}\\w{1,}=\\w{1,}"
     var result= text.match(re);
       if(result)
         {
                           alert(result);//?test=1&ww=234,test=1&        
              alert(result[0]+",0");//?test=1&ww=234
        alert(result[1]+",1");//test=1&
   }else
          {
          alert("err");  
         }  
      }

其实字符串类还有多个函数可以传递正则表达式,split,search,replace等但这些方法已经不适合验证了。
 function test(){ 
    var text="index.aspx?test=1&ww=234"; //
          var   re = /\?(\w{1,}=\w{1,}&){1,}\w{1,}=\w{1,}/;
     //   var   re2 = "(\\w{1,}=\\w{1,}&){1,}\\w{1,}=\\w{1,}"
     var result= text.split(re);     
                  alert(result);        
           alert(result[0]+",0");
        alert(result[1]+",1");    
      }

3正则表达式式的转义字符
在正则表达式中会经常出现转义字符,例如问号?在正则表达式中有特殊的含义,如果需要匹配问号?就需要转义,使用转义字符反斜杠\
如下两个都是匹配问号开头的一段字符串
 function test(){ 
   var text="?test=1&ww=2&www=3";
           var   re = /^\?(\w{1,}=\w{1,}&){1,}\w{1,}=\w{1,}/;//  \?表示配置问号?
   //  var   re =new RegExp( "^\\?(\\w{1,}=\\w{1,}&){1,}\\w{1,}=\\w{1,}");//  \\?表示配置问号?
        var result=  re.exec(text); 
      if(result)
     {
           alert("ok"); 
                 alert(result);        
           alert(result[0]+",0");
        alert(result[1]+",1");     
     }else
     {
      alert("err");  
     }         }

Javascript 相关文章推荐
javascript 获取元素位置的快速方法 getBoundingClientRect()
Nov 26 Javascript
精心挑选的15个jQuery下拉菜单制作教程
Jun 15 Javascript
js弹出div并显示遮罩层
Feb 12 Javascript
JavaScript实现的圆形浮动标签云效果实例
Aug 06 Javascript
详解jQuery停止动画——stop()方法的使用
Dec 14 Javascript
原生js实现简单的模态框示例
Sep 08 Javascript
angularJS的radio实现单项二选一的使用方法
Feb 28 Javascript
在vue2.0中引用element-ui组件库的方法
Jun 21 Javascript
JavaScript中的ES6 Proxy的具体使用
Jun 16 Javascript
在vue中使用防抖和节流,防止重复点击或重复上拉加载实例
Nov 13 Javascript
vue实现把接口单独存放在一个文件方式
Aug 13 Javascript
一起来看看Vue的核心原理剖析
Mar 24 Vue.js
解析Jquery的LigerUI如何实现文件上传
Jul 09 #Javascript
Js(JavaScript)中,弹出是或否的选择框示例(confirm用法的实例分析)
Jul 09 #Javascript
探讨在JQuery和Js中,如何让ajax执行完后再继续往下执行
Jul 09 #Javascript
Jquery中LigerUi的弹出编辑框(实现方法)
Jul 09 #Javascript
浅析js中取绝对值的2种方法
Jul 09 #Javascript
浅析LigerUi开发中谨慎载入common.css文件
Jul 09 #Javascript
浅析Js(Jquery)中,字符串与JSON格式互相转换的示例(直接运行实例)
Jul 09 #Javascript
You might like
laravel框架实现去掉URL中index.php的方法
2019/10/12 PHP
常见表单重复提交问题整理及解决方法
2013/11/13 Javascript
Web表单提交之disabled问题js解决方法
2015/01/13 Javascript
js实现九宫格图片半透明渐显特效的方法
2015/02/16 Javascript
JavaScript实现彩虹文字效果的方法
2015/04/16 Javascript
javascript比较两个日期相差天数的方法
2015/07/23 Javascript
javascript实现选中复选框后相关输入框变灰不可用的方法
2015/08/11 Javascript
vue中的自定义分页插件组件的示例
2018/08/18 Javascript
微信小程序基于canvas渐变实现的彩虹效果示例
2019/05/03 Javascript
编写Python的web框架中的Model的教程
2015/04/29 Python
python抓取最新博客内容并生成Rss
2015/05/17 Python
Flask框架的学习指南之开发环境搭建
2016/11/20 Python
利用Python实现Windows定时关机功能
2017/03/21 Python
Python内置函数reversed()用法分析
2018/03/20 Python
Python实现合并同一个文件夹下所有PDF文件的方法示例
2018/04/28 Python
Python之列表的插入&替换修改方法
2018/06/28 Python
如何在django里上传csv文件并进行入库处理的方法
2019/01/02 Python
Python格式化字符串f-string概览(小结)
2019/06/18 Python
python实现根据文件格式分类
2019/10/31 Python
Python调用shell命令常用方法(4种)
2020/05/11 Python
Python中random模块常用方法的使用教程
2020/10/04 Python
python 用pandas实现数据透视表功能
2020/12/21 Python
在html页面中取得session中的值的方法
2020/08/11 HTML / CSS
英国天然宝石首饰购买网站:Gemondo Jewellery
2018/10/23 全球购物
高考自主招生自荐信
2013/10/20 职场文书
亮化工程实施方案
2014/03/17 职场文书
高一新生军训方案
2014/05/12 职场文书
大学生党员学习焦裕禄精神思想汇报
2014/09/10 职场文书
2014大学生职业生涯规划书最新范文
2014/09/13 职场文书
党员批评与自我批评发言
2014/10/02 职场文书
早上好问候语大全
2015/11/10 职场文书
详解Laravel服务容器的优势
2021/05/29 PHP
opencv检测动态物体的实现
2021/07/21 Python
三种方式清除vue路由跳转router-link的历史记录
2022/04/10 Vue.js
win10电脑右下角输入法图标不见了?Win10右下角不显示输入法的解决方法
2022/07/23 数码科技
css之clearfix的用法深入理解(必看篇)
2023/05/21 HTML / CSS