技术标签 TAGS

专业技术精选

首页 > 技术 > 前端技术

精通 JS正则表达式

2010-11-04 17:16:12 by 【6yang】, 101 visits, 收藏 | 返回

<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">


/*
前面的<(.*)>可以匹配一个<abc>之类的文本中的abc
后面的是对它的引用，再加上/,就可以得到</abc>了

组合在一起就可以了匹配<abc>123456789abc</abc>这类的文本了。

当然，既然是分组，也可以给这个组起个名字，以方便调用。

对比下面这个看看

<(?<aaa>.*)>.*</k<aaa>>

这里的组名就是 aaa 了

-----------------------------------------------

是对第一个括号里的内容进行应用吗？那则是对第二个括号里的内容进行引用咯

的确是这样，不过注意一下，是小括号哦

再举个例子吧

原始文本是 <abc c=ss>00000000000</abc c=ss>

可以使用这样的正则表达式，当然，只是为了说明，实际操作中这样反而麻烦了

<(.*)s(c=ss)>.*</s> */


jQuery(function($){
 $("ul").each(function(i){
   $(this).find("li.bad").prev("li").find("input").attr("checked",true);
  
 })
 
 var txt = $("#text").html();
 //re = /^http([^.]*).$/i  //决断是否以http 开头 .结尾
 re = /^http.*.$/i  //决断是否以http 开头 .结尾
 //re = /(^http)|(.$)/i
 //re = /[^0-9]/i
 //re = /sdBsd/i
 //alert(re.test(txt));
 
 var x = "aaaabbbbcccde";
 var num ="ag12";
 //alert(x.replace(/.*?(.)(?!)/g,"$1"));//判断重复的字母
 re = /.*?(.)(?!)/g
 //alert(re.test(x));
 
 var textNum = "234.0";
 reNum = /^d{3}$/igm; //判断是否为三位数
 //alert(reNum.test(textNum));
 
 var txtIP = "12.212.222.123";//判断IP.深入了解其它情况
 reIP = /(d{1,3}.){3}d{1,3}/i; 
 //alert(reIP.test(txtIP));
 
 var textLianxu ="1221";
 reLianxu =/^d{3}(?!d)/;
 //alert(reLianxu.test(textLianxu));
 
 var textDate = "1982-012-22";
 reDate = /^(19|20)d{2}-(0?d|1[012])-(0?d|[12]d|3[01])$/; //判断日期.
 //alert(reDate.test(textDate));
 
 var textDate01 = "111";
 reDate01 = /^d$/; 
 //alert(reDate01.test(textDate01));////判断只能输入一个字符
 
 var textFloat = "04442333511.1243";
 reFloat = /^(?=0)(d{11}).(d){4}$/i;
 //alert(reFloat.test(textFloat));////判断浮点数
 
 var textChar = "__";
 reChar = /^[A-Z|a-z]+|[d]+|[u4e00-u9fa5]+$/i;
 //alert(reChar.test(textChar)); ////判断 限大小字母数字汉字
 
/********************* replace***********************/

 var textContent = "//congradulation for you about\\ the// grad\\!";
 alert(textContent.search('cff'));
 if(textContent.search('cff') != -1)
 { 
  alert(textContent.replace(////g, ""));
 }

})

</script>
<ul>
 <li><input type="radio" name="g1" value="g1">good</li>
 <li class="bad">badli</li>
</ul>

<ul>
 <li><input type="radio" name="g2" value="g2">good</li>
 <li class="bad">badli55</li>
</ul>

<div id="text">http hove dfsaf sdfsdf.</div>

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>FOO API</title>
</head>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javaScript">
$(function() {
 var aValue="http://www.163.com/";
 //aValue = aValue.replace(/http://(.+)/[^/]*/i,'$1');
 aValue = aValue.replace(/[^a-z]/g,'');
 alert(aValue);
 arr = aValue.split(',');
 for(var i= 0; i< arr.length; i++ ){
  //alert(arr[i]);
 }
 
 
 re = /zo*/;
 str = "azoo";
 alert(str.replace(re,""));//在这个里面$1表示第一个分组1234,$2则表示5678

});
</script>
<style type="text/css">
 #menu1 span,
 #menu2 span{
  display:none;
}
</style>

<body>
 
</body>
</html>

 

精通 JS正则表达式 (精通?标题党 )
正则表达式可以:
•测试字符串的某个模式。例如，可以对一个输入字符串进行测试，看在该字符串是否存在一个电话号码模式或一个信用卡号码模式。这称为数据有效性验证
•替换文本。可以在文档中使用一个正则表达式来标识特定文字，然后可以全部将其删除，或者替换为别的文字
•根据模式匹配从字符串中提取一个子字符串。可以用来在文本或输入字段中查找特定文字

正则表达式语法
一个正则表达式就是由普通字符（例如字符 a 到 z）以及特殊字符（称为元字符）组成的文字模式。该模式描述在查找文字主体时待匹配的一个或多个字符串。正则表达式作为一个模板，将某个字符模式与所搜索的字符串进行匹配。

创建正则表达式

Js代码
  1. var re = new RegExp();//RegExp是一个对象,和Aarray一样  
  2. //但这样没有任何效果,需要将正则表达式的内容作为字符串传递进去  
  3. re =new RegExp("a");//最简单的正则表达式,将匹配字母a  
  4. re=new RegExp("a","i");//第二个参数,表示匹配时不分大小写  


RegExp构造函数第一个参数为正则表达式的文本内容,而第一个参数则为可选项标志.标志可以组合使用

•g （全文查找）
•i （忽略大小写）
•m （多行查找）

Js代码
  1. var re = new RegExp("a","gi");//匹配所有的a或A  

正则表达式还有另一种正则表达式字面量的声明方式
Js代码
  1. var re = /a/gi;  


和正则表达式相关的方法和属性


正则表达式对象的方法

•test,返回一个 Boolean 值，它指出在被查找的字符串中是否存在模式。如果存在则返回 true，否则就返回 false。
•exec,用正则表达式模式在字符串中运行查找，并返回包<script type="text/javascript" src="http://www.javaeye.com/javascripts/tinymce/themes/advanced/langs/zh.js"></script><script type="text/javascript" src="http://www.javaeye.com/javascripts/tinymce/plugins/javaeye/langs /zh.js"></script>含该查找结果的一个数组。
•compile,把正则表达式编译为内部格式，从而执行得更快。
正则表达式对象的属性

•source,返回正则表达式模式的文本的复本。只读。
•lastIndex,返回字符位置，它是被查找字符串中下一次成功匹配的开始位置。
•$1...$9,返回九个在模式匹配期间找到的、最近保存的部分。只读。
•input ($_),返回执行规范表述查找的字符串。只读。
•lastMatch ($&),返回任何正则表达式搜索过程中的最后匹配的字符。只读。
•lastParen ($+),如果有的话，返回任何正则表达式查找过程中最后括的子匹配。只读。
•leftContext ($`),返回被查找的字符串中从字符串开始位置到最后匹配之前的位置之间的字符。只读。
•rightContext ($'),返回被搜索的字符串中从最后一个匹配位置开始到字符串结尾之间的字符。只读。
String对象一些和正则表达式相关的方法

•match,找到一个或多个正则表达式的匹配。
•replace,替换与正则表达式匹配的子串。
•search,检索与正则表达式相匹配的值。
•split,把字符串分割为字符串数组。


测试正则表达式是如何工作的!
Js代码
  1. //test方法,测试字符串,符合模式时返回true,否则返回false  
  2. var re = /he/;//最简单的正则表达式,将匹配he这个单词  
  3. var str = "he";  
  4. alert(re.test(str));//true  
  5. str = "we";  
  6. alert(re.test(str));//false  
  7. str = "HE";  
  8. alert(re.test(str));//false,大写,如果要大小写都匹配可以指定i标志(i是ignoreCase或case-insensitive的表示)  
  9. re = /he/i;  
  10. alert(re.test(str));//true  
  11. str = "Certainly!He loves her!";  
  12. alert(re.test(str));//true,只要包含he(HE)就符合,如果要只是he或HE,不能有其它字符,则可使用^和$  
  13. re = /^he/i;//脱字符(^)代表字符开始位置  
  14. alert(re.test(str));//false,因为he不在str最开始  
  15. str = "He is a good boy!";  
  16. alert(re.test(str));//true,He是字符开始位置,还需要使用$  
  17. re = /^he$/i;//$表示字符结束位置  
  18. alert(re.test(str));//false  
  19. str = "He";  
  20. alert(re.test(str));//true  
  21. //当然,这样不能发现正则表达式有多强大,因为我们完全可以在上面的例子中使用==或indexOf  
  22. re = /s/;// s匹配任何空白字符，包括空格、制表符、换页符等等  
  23. str= "user Name";//用户名包含空格  
  24. alert(re.test(str));//true  
  25. str = "user     Name";//用户名包含制表符  
  26. alert(re.test(str));//true  
  27. re=/^[a-z]/i;//[]匹配指定范围内的任意字符,这里将匹配英文字母,不区分大小写  
  28. str="variableName";//变量名必须以字母开头  
  29. alert(re.test(str));//true  
  30. str="123abc";  
  31. alert(re.test(str));//false  


当然,仅仅知道了字符串是否匹配模式还不够,我们还需要知道哪些字符匹配了模式

Js代码
  1. var osVersion = "Ubuntu 8";//其中的8表示系统主版本号  
  2. var re = /^[a-z]+s+d+$/i; //+号表示字符至少要出现1次,s表示空白字符,d表示一个数字  
  3. alert(re.test(osVersion));//true,但我们想知道主版本号  
  4. //另一个方法exec,返回一个数组,数组的第一个元素为完整的匹配内容  
  5. re=/^[a-z]+s+d+$/i;  
  6. arr = re.exec(osVersion);  
  7. alert(arr[0]);//将osVersion完整输出,因为整个字符串刚好匹配re  
  8. //我只需要取出数字  
  9. re=/d+/;  
  10. var arr = re.exec(osVersion);  
  11. alert(arr[0]);//8  


更复杂的用法,使用子匹配
Js代码
  1. //exec返回的数组第1到n元素中包含的是匹配中出现的任意一个子匹配  
  2. re=/^[a-z]+s+(d+)$/i;//用()来创建子匹配  
  3. arr =re.exec(osVersion);  
  4. alert(arr[0]);//整个osVersion,也就是正则表达式的完整匹配  
  5. alert(arr[1]);//8,第一个子匹配,事实也可以这样取出主版本号  
  6. alert(arr.length);//2  
  7. osVersion = "Ubuntu 8.10";//取出主版本号和次版本号  
  8. re = /^[a-z]+s+(d+).(d+)$/i;//.是正则表达式元字符之一,若要用它的字面意义须转义  
  9. arr = re.exec(osVersion);  
  10. alert(arr[0]);//完整的osVersion  
  11. alert(arr[1]);//8  
  12. alert(arr[2]);//10  


注意,当字符串不匹配re时,exec方法将返回null 

String对象的一些和正则表达式有关的方法
Js代码
  1. //replace方法,用于替换字符串  
  2. var str ="some money";  
  3. alert(str.replace("some","much"));//much money  
  4. //replace的第一个参数可以为正则表达式  
  5. var re = /s/;//空白字符  
  6. alert(str.replace(re,"%"));//some%money  
  7. //在不知道字符串中有多少空白字符时,正则表达式极为方便  
  8. str ="some some              some ";  
  9. re = /s+/;  
  10. alert(str.replace(re,"#"));//但这样只会将第一次出现的一堆空白字符替换掉  
  11. //因为一个正则表达式只能进行一次匹配,s+匹配了第一个空格后就退出了  
  12. re = /s+/g;//g,全局标志,将使正则表达式匹配整个字符串  
  13. alert(str.replace(re,"@"));//some@some@some@  
  14. //另一个与之相似的是split  
  15. var str = "a-bd-c";  
  16. var arr = str.split("-");//返回["a","bd","c"]  
  17. //如果str是用户输入的,他可能输入a-bd-c也可能输入a bd c或a_bd_c,但不会是abdc(这样就说他输错了)  
  18. str = "a_db-c";//用户以他喜欢的方式加分隔符s  
  19. re=/[^a-z]/i;//前面我们说^表示字符开始,但在[]里它表示一个负字符集  
  20. //匹配任何不在指定范围内的任意字符,这里将匹配除字母处的所有字符  
  21. arr = str.split(re);//仍返回["a","bd","c"];  
  22. //在字符串中查找时我们常用indexOf,与之对应用于正则查找的方法是search  
  23. str = "My age is 18.Golden age!";//年龄不是一定的,我们用indexOf不能查找它的位置  
  24. re = /d+/;  
  25. alert(str.search(re));//返回查找到的字符串开始下标10  
  26. //注意,因为查找本身就是出现第一次就立即返回,所以无需在search时使用g标志  
  27. //下面的代码虽然不出错,但g标志是多余的  
  28. re=/d+/g;  
  29. alert(str.search(re));//仍然是10  

注意,当search方法没有找到匹配时,将返回-1

类似于exec方法,String对象的match方法也用于将字符串与正则表达式进行匹配并返回结果数组


Js代码
  1. var str = "My name is CJ.Hello everyone!";  
  2. var re = /[A-Z]/;//匹配所有大写字母  
  3. var arr = str.match(re);//返回数组  
  4. alert(arr);//数组中只会包含一个M,因为我们没有使用全局匹配  
  5. re = /[A-Z]/g;  
  6. arr = str.match(re);  
  7. alert(arr);//M,C,J,H  
  8. //从字符串中抽取单词  
  9. re = /[a-z]*/gi;//表示单词边界  
  10. str = "one two three four";  
  11. alert(str.match(re));//one,two,three,four  


RegExp对象实例的一些属性
Js代码
  1. var re = /[a-z]/i;  
  2. alert(re.source);//将[a-z]字符串输出  
  3. //请注意,直接alert(re)会将正则表达式连同前向斜线与标志输出,这是re.toString方法定义的  


每个RegExp对象的实例具有lastIndex属性,它是被查找字符串中下一次成功匹配的开始位置,默认值是-1。 lastIndex 属性被 RegExp 对象的 exec 和 test 方法修改.并且它是可写的.
Js代码
  1. var re = /[A-Z]/;  
  2. //exec方法执行后,修改了re的lastIndex属性,  
  3. var str = "Hello,World!!!";  
  4. var arr = re.exec(str);  
  5. alert(re.lastIndex);//0,因为没有设置全局标志  
  6. re = /[A-Z]/g;  
  7. arr = re.exec(str);  
  8. alert(re.lastIndex);//1  
  9. arr = re.exec(str);  
  10. alert(re.lastIndex);//7  


当匹配失败（后面没有匹配），或lastIndex值大于字符串长度时，再执行exec等方法会将lastIndex设为0(开始位置)
Js代码
  1. var re = /[A-Z]/;  
  2. var str = "Hello,World!!!";  
  3. re.lastIndex = 120;  
  4. var arr = re.exec(str);  
  5. alert(re.lastIndex);//0  


RegExp对象的静态属性
Js代码
  1. //input 最后用于匹配的字符串（传递给test,exec方法的字符串）  
  2. var re = /[A-Z]/;  
  3. var str = "Hello,World!!!";  
  4. var arr = re.exec(str);  
  5. alert(RegExp.input);//Hello,World!!!  
  6. re.exec("tempstr");  
  7. alert(RegExp.input);//仍然是Hello,World!!!,因为tempstr不匹配  
  8. //lastMatch 最后匹配的字符  
  9. re = /[a-z]/g;  
  10. str = "hi";  
  11. re.test(str);  
  12. alert(RegExp.lastMatch);//h  
  13. re.test(str);  
  14. alert(RegExp["$&"]);//i  ,$&是lastMatch的短名字，但由于它不是合法变量名，所以要。。  
  15. //lastParen 最后匹配的分组  
  16. re = /[a-z](d+)/gi;  
  17. str = "Class1 Class2 Class3";  
  18. re.test(str);  
  19. alert(RegExp.lastParen);//1  
  20. re.test(str);  
  21. alert(RegExp["$+"]);//2  
  22. //leftContext  返回被查找的字符串中从字符串开始位置到最后匹配之前的位置之间的字符  
  23. //rigthContext 返回被搜索的字符串中从最后一个匹配位置开始到字符串结尾之间的字符  
  24. re = /[A-Z]/g;  
  25. str = "123ABC456";  
  26. re.test(str);  
  27. alert(RegExp.leftContext);//123  
  28. alert(RegExp.rightContext);//BC456  
  29. re.test(str);  
  30. alert(RegExp["$`"]);//123A  
  31. alert(RegExp["$'"]);//C456  


multiline属性返回正则表达式是否使用多行模式,这个属性不针对某个正则表达式实例，而是针对所有正则表达式，并且这个属性可写.(IE与Opera不支持这个属性)
Js代码
  1. alert(RegExp.multiline);  
  2. //因为IE，Opera不支持这个属性，所以最好还是单独指定  
  3. var re = /w+/m;  
  4. alert(re.multiline);  
  5. alert(RegExp["$*"]);//RegExp对象的静态属性不会因为给RegExp某个对象实例指定了m标志而改变  
  6. RegExp.multiline = true;//这将打开所有正则表达式实例的多行匹配模式  
  7. alert(RegExp.multiline);  


使用元字符注意事项:元字符是正则表达式的一部分，当我们要匹配正则表达式本身时，必须对这些元字符转义.下面是正则表达式用到的所有元字符
( [ { ^ $ | ) ? * + .
Js代码
  1. var str = "?";  
  2.     var re = /?/;  
  3.     alert(re.test(str));//出错，因为？是元字符，必须转义  
  4.     re = /?/;  
  5.     alert(re.test(str));//true  


使用RegExp构造函数与使用正则表达式字面量创建正则表达式注意点

Js代码
  1. var str = "?";  
  2. alert(str);//只会输出?  
  3. var re = /?/;//将匹配?  
  4. alert(re.test(str));//true  
  5. re = new RegExp("?");//出错,因为这相当于re = /?/  
  6. re = new RegExp("\?");//正确，将匹配？  
  7. alert(re.test(str));//true  


既然双重转义这么不友好，所以还是用正则表达式字面量的声明方式

如何在正则表达式中使用特殊字符？

Js代码
  1. //ASCII方式用十六进制数来表示特殊字符  
  2. var re = /^CJ$/;//将匹配CJ  
  3. alert(re.test("CJ"
    分享到：
    我要评论 本文来自:http://www.6yang.net/articles_view.php?id=829&cid=7
    share

    图片原图

    loading

    loading