• js正则表达式入门

    1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
    2. <html>  
    3.  <head>  
    4.   <title> javascript 正则表达式 </title>  
    5.   <meta name="Generator" content="EditPlus">  
    6.   <meta name="Author" content="">  
    7.   <meta name="Keywords" content="">  
    8.   <meta name="Description" content="">  
    9.     <script type="text/javascript">  
    10. //javascript正则表达式的基本知识  
    11.   
    12.     //声明javascript 正则表达式  
    13.      var reCat = new RegExp("cat");  
    14.     //你也可以   
    15.      var reCat = /cat/;      //Perl 风格   （推荐）  
    16.   
    17.     //学习最常用的 test exec match search  replace  split 6个方法  
    18.   
    19.       //1） test  检查指定的字符串是否存在  
    20.   
    21.        var data = "123123";  
    22.        var reCat = /123/gi;  
    23.        alert(reCat.test(data));  //true  
    24.        
    25.        //检查字符是否存在  g 继续往下走  i 不区分大小写  
    26.   
    27.      //2） exec 返回查询值  
    28.   
    29.        var data = "123123,213,12312,312,3,Cat,cat,dsfsdfs,";  
    30.        var reCat = /cat/i;  
    31.        alert(reCat.exec(data));  //Cat  
    32.   
    33.      //3）match  得到查询数组  
    34.   
    35.        var data = "123123,213,12312,312,3,Cat,cat,dsfsdfs,";  
    36.        var reCat = /cat/gi;  
    37.        var arrMactches = data.match(reCat)  
    38.   
    39.        for (var i=0;i < arrMactches.length ; i++)  
    40.        {  
    41.             alert(arrMactches[i]);   //Cat  cat  
    42.        }  
    43.   
    44.      //4） search  返回搜索位置  类似于indexof  
    45.   
    46.        var data = "123123,213,12312,312,3,Cat,cat,dsfsdfs,";  
    47.        var reCat = /cat/gi;  
    48.        alert(data.search(reCat));  //23  
    49.   
    50.   
    51.     //5） replace  替换字符  利用正则替换  
    52.   
    53.        var data = "123123,213,12312,312,3,Cat,cat,dsfsdfs,";  
    54.        var reCat = /cat/gi;  
    55.        alert(data.replace(reCat,"libinqq"));  
    56.   
    57.     //6）split   利用正则分割数组  
    58.   
    59.        var data = "123123,213,12312,312,3,Cat,cat,dsfsdfs,";  
    60.        var reCat = /\,/;  
    61.        var arrdata = data.split(reCat);  
    62.   
    63.        for (var i = 0; i < arrdata.length; i++)  
    64.        {  
    65.             alert(arrdata[i]);  
    66.        }  
    67.   
    68.     //学习下  简单类   负向类  范围类  组合类  
    69.   
    70.     //简单类  
    71.        var data = "1libinqq,2libinqq,3libinqq,4libinqq";  
    72.        var reCat = /[123]libinqq/gi;  
    73.        var arrdata = data.match(reCat);  
    74.   
    75.        for (var i = 0; i < arrdata.length; i++)  
    76.        {  
    77.             alert(arrdata[i]);  // 1libinqq 2libinqq  3libinqq  
    78.        }  
    79.   
    80.        //负向类  
    81.        var data = "alibinqq,1libinqq,2libinqq,3libinqq,4libinqq";  //u0062cf  
    82.        var reCat = /[^a123]libinqq/gi;  
    83.        var arrdata = data.match(reCat);  
    84.   
    85.        for (var i = 0; i < arrdata.length; i++)  
    86.        {  
    87.             alert(arrdata[i]);  //4libinqq  
    88.        }  
    89.   
    90.        //范围类  
    91.        var data = "libinqq1,libinqq2,libinqq3,libinqq4,libinqq5";  //u0062cf  
    92.        var reCat = /libinqq[2-3]/gi;  
    93.        var arrdata = data.match(reCat);  
    94.   
    95.        for (var i = 0; i < arrdata.length; i++)  
    96.        {  
    97.             alert(arrdata[i]);   // libinqq2  libinqq3  
    98.        }  
    99.   
    100.        //组合类  
    101.       var data = "a,b,c,w,1,2,3,5";  //u0062cf  
    102.        var reCat = /[a-q1-4 ]/gi;  
    103.        var arrdata = data.match(reCat);  
    104.   
    105.        for (var i = 0; i < arrdata.length; i++)  
    106.        {  
    107.             alert(arrdata[i]);  // a b c 1 2 3  
    108.        }  
    109.        //以上为 js正则 最基本的使用方法  
    110.     </script>  
    111.  </head>  
    112.   
    113.  <body>  
    114.   
    115. <!-- javascript正则表达式 进阶篇  -->  
    116.   
    117. <!-- javascript  正则表达式是分组知识  -->  
    118.   
    119. <script language="JavaScript">  
    120.     /*正则表达式  简单的分组 
    121.     举例 我们要查找字符串 MouseMouse 
    122.  
    123.     var reCat = /MouseMouse/gi;  
    124.      
    125.     尽管这是可以的，但是有点浪费。如果不知道Mouse 在字符串中到底出现几次时该怎么办，如果重复多次呢。 
    126.     var reCat = /(mouse){2}/gi;    括号的意思列Mouse 将在一行连续出现2次。 
    127.  
    128.     */    
    129.       
    130.     var data = "Ah-mousemouse";    
    131.     var reCat = /(mouse){2}/gi;     
    132.     var arrdata = data.match(reCat);  
    133.   
    134.     for (var i = 0; i < arrdata.length; i++)  
    135.     {  
    136.         alert(arrdata[i]);  
    137.     }     
    138.   </script>  
    139.   
    140.   <script language="JavaScript">  
    141.     /*正则表达式  复杂的分组 
    142.          ?   零次 或 一次 
    143.     *   零次 或 多次 
    144.     +   最少一次 或 多次 
    145.     */    
    146.       
    147.     var data = "bb ba da bad dad aa ";    
    148.     var reCat = /([bd]ad?)/gi;   // 匹配出 ba da bad  dad  
    149.     var arrdata = data.match(reCat);  
    150.   
    151.     for (var i = 0; i < arrdata.length; i++)  
    152.     {  
    153.         alert(arrdata[i]);  
    154.     }      
    155.       
    156.   
    157.     // 同时 也不介意将分组放在分组中间  
    158.     // var re = /(mom( and dad)?)/;    匹配出 mom  或  mon and daa  
    159.   </script>  
    160.   
    161.   <script language="JavaScript">  
    162.     /*正则表达式  反向引用*/  
    163.   
    164.     var sToMatch = "#123456789";  
    165.     var reNumbers = /#(d+)/;  
    166.     reNumbers.test(sToMatch);  
    167.     alert(RegExp.$1);  
    168.   
    169.     /*  
    170.       这个例子尝试匹配后面跟着几个或多个数字的镑符合，并对数字进行分组 
    171.       以存储他们。在调用 test 方法后，所有的反向引用都保存到了 RegExp 构造函数中 
    172.       从 RegExp.$1(它保存了第一个反向引用）开始，如果还有第二个反向引用，就是 
    173.       RegExp.$2，如果还有第三个反向引用存在，就是 RegExp.$3.依此类推。因为该组 
    174.       匹配了 “123456780”，所以 RegExp.$1 中就存储了这个字符串。 
    175.  
    176.     */  
    177.   
    178.   
    179.     var sToChange = "1234 5678";  
    180.     var reMatch = /(d{4}) (d{4})/;  
    181.     var sNew = sToChange.replace(reMatch,"$2 $1");  
    182.     alert(sNew);  
    183.   
    184.     /* 
    185.       在这个例子中，正则表达式有两个分组，每一个分组有四个数字。在 replace() 方法的第二个参数 
    186.       中，$2 等同于 “5678” ，而 $1 等同于 “1234”，对应于它们在表达式中的出现顺序。 
    187.     */  
    188.   </script>  
    189.   
    190.  <script language="JavaScript">  
    191.     /*正则表达式  候选 */  
    192.     var sToMatch1 = "red";  
    193.     var sToMatch2 = "black";  
    194.     var reRed = /red/;  
    195.     var reBlack = /black/;  
    196.   
    197.     alert(reRed.test(sToMatch1) || reBlack.test(sToMatch1));  
    198.     alert(reRed.test(sToMatch2) || reBlack.test(sToMatch2));  
    199.   
    200.     /* 
    201.      这虽然能完成任务，但是十分沉长，还有另一种方式就是正则表达式的候选操作符。 
    202.     */  
    203.   
    204.     var sToMatch1 = "red";  
    205.     var sToMatch2 = "black";  
    206.     var reRedOrBlack = /(red|black)/;  
    207.     alert(reRedOrBlack.test(sToMatch1));  
    208.     alert(reRedOrBlack.test(sToMatch2));  
    209.   </script>  
    210.   
    211. <script language="JavaScript">  
    212.     /*正则表达式  非捕获性分组 
    213.      
    214.     如果要创建一个非捕获性分组，只要在左括号的后面加上一个问号和一个紧跟的冒号： 
    215.     */  
    216.   
    217.     var sToMatch = "#123456789";  
    218.     var reNumbers = /#(?:d+)/;  
    219.     reNumbers.test(sToMatch);  
    220.     alert(RegExp.$1);  
    221.   
    222.     /* 
    223.     这个例子的最后一行代码输出一个空字符串，因为该组是非捕获性的， 
    224.     */  
    225.   
    226.     var sToMatch = "#123456789";  
    227.     var reNumbers = /#(?:d+)/;  
    228.     alert(sToMatch.replace(reNumbers,"abcd$1"));  
    229.   
    230.     /* 
    231.     正因如此，replace()方法就不能通过 RegExp.$x 变量来使用任何反向引用，这段代码 
    232.     输出的“abcd$1”而不是abcd123456789, 因为$1 在这里并不被看成是一个反向引用。 
    233.     */  
    234.   </script>  
    235.   
    236.  <script language="JavaScript">  
    237.     /*正则表达式  前瞻 
    238.     前瞻 就和它名字一样，它告诉正则表达式运算器向前看一些字符而不是移动位置 
    239.     */  
    240.   
    241.   
    242.       var sToMatch1 = "bedroom";  
    243.       var sToMatch2 = "bedding";  
    244.       var reBed = /bed(?=room)/;   
    245.       alert(reBed.test(sToMatch1));  //true  
    246.       alert(reBed.test(sToMatch2));  //false  
    247.      
    248.     //负向前瞻  
    249.       
    250.       var sToMatch1 = "bedroom";  
    251.       var sToMatch2 = "bedding";  
    252.       var reBed = /bed(?!room)/;   
    253.       alert(reBed.test(sToMatch1)); //false  
    254.       alert(reBed.test(sToMatch2)); //true  
    255.   </script>  
    256.   
    257.    <script language="JavaScript">  
    258.     /*正则表达式  边界 
    259.     ^     行开头 
    260.     $     行结尾 
    261.         单词的边界 
    262.     B    非单词的边界 
    263.     */  
    264.   
    265.       var sToMatch = "Important word is the last one.";  
    266.       var reLastWord = /(w+).$/;   
    267.       reLastWord.test(sToMatch);  
    268.       alert(RegExp.$1);  //one  
    269.   
    270.     /* 
    271.     假如想查找一个单词，但要它只出现在行尾，则可以使用美元符号 ($)来表示它： 
    272.     */  
    273.   
    274.   
    275.   
    276.       var sToMatch = "Important word is the last one.";  
    277.       var reLastWord = /^(w+)/;   
    278.       reLastWord.test(sToMatch);  
    279.       alert(RegExp.$1);  //Important  
    280.   
    281.     /* 
    282.     在这个例子中，正则表达式查找行起始位置后的一个或多个单词字符。如果遇到非单词字符 
    283.     匹配停止，返回 Important。 这个例子也可以用单词边界实现。 
    284.     */  
    285.      
    286.       var sToMatch = "Important word is the last one.";  
    287.       var reLastWord = /^(.+?)/;   
    288.       reLastWord.test(sToMatch);  
    289.       alert(RegExp.$1);  //Important  
    290.       
    291.     /* 
    292.     这里，正则表达式用惰性量词来制定在单词边界之前可以出现任何字符，且可以出现一次或 
    293.     多次（如果使用贪婪性量词，表达式就匹配整个字符串）。 
    294.     */  
    295.   
    296.     var data = " First second thind fourth fifth sixth ";    
    297.     var reCat = /(S+?)/g;     
    298.     var arrdata = data.match(reCat);  
    299.   
    300.     for (var i = 0; i < arrdata.length; i++)  
    301.     {  
    302.         alert(arrdata[i]);  
    303.     }     
    304.   
    305.     /* 
    306.     使用单词边界可以方便地从字符串中抽取单词。 
    307.     */  
    308.   </script>  
    309.   
    310.     <script language="JavaScript">  
    311.     /*正则表达式  多行模式 
    312.     
    313.       要制定多行模式，只要在正则表达式想要匹配的行末的一个单词 
    314.     */    
    315.       
    316.     var data = " First second  thind fourth  fifth sixth";    
    317.     var reCat = /(w+)$/g;     
    318.     var arrdata = data.match(reCat);  
    319.   
    320.     for (var i = 0; i < arrdata.length; i++)  
    321.     {  
    322.         alert(arrdata[i]);  
    323.     }    
    324.       
    325.     /* 
    326.       上面只返回一个单词 sixth，因为换行符阻挡了匹配，只能匹配行末的一个单词， 
    327.     当然也可以使用 split() 方法将字符串分割成数组，但就得对每一行进行单独匹配。 
    328.  
    329.     以前不好好看书经常半吊子，看一半就仍了，导致用了好多 split， 其实很简单如下面 
    330.     例子 只需要 m 参数进行多行匹配。 
    331.  
    332.     */    
    333.     var data = " First second  thind fourth  fifth sixth";    
    334.     var reCat = /(w+)$/gm;     
    335.     var arrdata = data.match(reCat);  
    336.   
    337.     for (var i = 0; i < arrdata.length; i++)  
    338.     {  
    339.         alert(arrdata[i]);  
    340.     }    
    341.   </script>  
    342.  </body>  
    343. </html>  
  • 相关阅读:
    原生js设置cookie
    vuex数据持久化存储
    export和export default的区别
    userAgent判断是微信还是企业微信
    SVN的使用方法
    Js字符串反转
    通用JS10——一元加和减
    通用JS十——递增/递减操作符
    通用JS9
    @SuppressWarning注解用法
  • 原文地址：https://www.cnblogs.com/hoobey/p/6100664.html
Copyright © 2020-2023  润新知