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\n]/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.     \b    单词的边界 
  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 = /^(.+?)\b/;   
  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 = /\b(\S+?)\b/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\n thind fourth\n 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\n thind fourth\n 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>  
posted @ 2016-11-25 10:43  starskyhu  阅读(1621)  评论(0)  编辑  收藏  举报