JavaScript 正则表达式

一、概念：

什么是正则表达式？它出现的意义何在？

1、打个比喻。现在的女人找未来老公的标准：“多金，不花心，爱自己，无不良嗜好，帅”，相亲的时候她就开始把眼前的人的各项指标进行匹配，最终打分。

正则表达式就是：一个待匹配的模版，等同于上边的标准

2、存在的意义呢？例如：我们在上网的时候输入用户名，密码都有一定的规则（字母开头，长度多少）；身份证有效性验证，邮箱有效性验证，这些在存入数据库之前都会进行有效性验证的，那么它靠什么验证呢?

就是一个模版，一个标准，一个正则表达式。有人就说了这个用String 对象就可以了,indexof,substr 等函数，是的可以的，但是实现起来非常复杂，所以开发了RegExp 对象 —— 正则表达式对象

二、基本语法

new RegExp(pattern, attributes);

说明：

参数 pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式。

参数 attributes 是一个可选的字符串，包含属性 "g"、"i" 和 "m"，分别用于指定全局匹配、区分大小写的匹配和多行匹配。ECMAScript 标准化之前，不支持 m 属性。如果 pattern 是正则表达式，而不是字符串，则必须省略该参数。

2.1 常用方法：

　　1、compile() 编译正则表达式对象，常用于改变表达式。

<script type="text/javascript">

var str="Every man in the world! Every woman on earth!";

patt=/man/g;
str2=str.replace(patt,"person");
document.write(str2+"<br />");

patt=/(wo)?man/g;
patt.compile(patt);
str2=str.replace(patt,"person");
document.write(str2);

</script>

　　2、exec() 方法用于检索字符串中的正则表达式的匹配。

 1 <script type="text/javascript">
 2 
 3 var str = "Visit W3School"; 
 4 var patt = new RegExp("W3School","g");
 5 var result;
 6 
 7 while ((result = patt.exec(str)) != null)  {
 8   document.write(result);
 9   document.write("<br />");
10   document.write(patt.lastIndex);
11  }
12 </script>

　　Result：

　　W3School

　　　　14　　
　　3、test() ：方法用于检测一个字符串是否匹配某个模式。返回：true，false

2.2、模式中用的元字符

　　建议查询w3c： http://www.w3school.com.cn/jsref/jsref_obj_regexp.asp

三、实战举例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js-正则表达式28个列子</title>
</head>
<body>
    <script>    
        // 1、从字符串中提取最后两个字符 3SFASDF92 取出92
        // var str = "3SFASDF92";
        // var reg = /\d+$/g; //默认就是正则表达式
        // var result = reg.exec(str);
        // alert(result);
        // 2、去除多余空格：蓝   色 理      想 变成：蓝 色 理 想
        // var str = "蓝   色 理      想";
        // var patt = /\s+/g;
        // var regexp = new RegExp(patt);
        // var result = str.replace(regexp," ");
        // alert(result);
        // 3、判断一个字符串是否由数字全部组成
        // function isDigit(str) {
        //     var patt = /^\d*$/g;
        //     return patt.test(str);
        // }
        // var str = "4654657984";
        // alert(isDigit(str));
        // 4、匹配电话号码
        // var patt = /^\d{3,4}-\d{7,8}(-\d{3,4})?$/g
        // var str = "0755-83897476";
        // alert(patt.test(str));
        // 5、是否是手机号码 仅支持13,15 网段的手机号码
        // function isTelNum(str) {
        //     var patt = /^0?(13|15)\d{9}$/g; //注意这里是() 不是[]
        //     return patt.test(str);
        // }
        // var tel = "13926592220";
        // var tel2 = "15019228061";
        // alert(isTelNum(tel2));
        // 6、取消字符串两边的空格，trim ltrim rtrim 功能
        // function trim(str) {
        //     return str.replace(/^\s+|\s+$/g,'');
        // }
        // var str = " fdsafs  adfasdf  "
        // var result = trim(str);
        // document.write(str+"<br>");
        // document.write(str.length+"<br>");
        // document.write(result+"<br>");
        // document.write(result.length+"<br>");
        // 7.对于输入框的限制
        //     7.1 只能输入精确到两位的小数或者整数
        // function validDigit(str) {
        //     var patt = /^\d*\.?\d{0,2}$/g;//小数点等特殊字符要加\转义
        //     return patt.test(str);
        // }
        // var str = ".1"
        // alert(validDigit(str));
            // 7.2 包含字母，/ \ : . 字符一次或者多次
            // var patt = /[a-z\.\/\\:]+/;
        // 8. 替换小数点前边的内容 ：infomarket.php?id=197 替换为test.php?id=197
            // var str = "infomarket.php?id=197";
            // var patt = /^\w*/;
            // alert(str.replace(patt,"test"));
            // 9.所有的中文替换掉。 中文范围：/[\u4E00-\u9FA5\uf900-\ufa2d]/
            // var patt = /[\u4E00-\u9FA5\uf900-\ufa2d]/g;
            // var text = "我是中国人HelloWorld,dfasd";
            // alert(text.replace(patt,""));
        // 9.匹配ip 地址 192.168.118.101，192.168.118.72, 192.168.118.1都替换成：192.168.118
            // var str = "192.168.118.1";
            // var patt = /\.\d+$/g
            // alert(str.replace(patt,""));
            // var str ="<ul>safsf<ul>safsf</ul><ul>safsf</ul></ul>";
            // var patt = /<ul>[\s|\S]+?<\/ul>/i; // +? 启用非贪婪模式
            // console.log(patt.exec(str)); //exec 执行成功后返回的是一个数组
            // 10.返回文件名，去掉路径
            // function getFileName(str){
            //     var reg = /[^\\\/]*[\\\/]+/g;
            //     str = str.replace(reg,'');
            //     return str;
            // }
            // var str = "c:\\images\\tupian\\006.jpg";
            // document.write(getFileName(str)+'<br />');
            // var str2 = "c:/images/tupian/test2.jpg";
            // document.write(getFileName(str2));
            // 10. 绝对路径改相对路径
            // var str = '<IMG height="120" width="800" src="http://23.123.22.12/image/somepic.gif">';
            // var reg = /http:\/\/[^\/]+/;
            // str = str.replace(reg,"");
            // alert(str)
            // 11.用户名有效性
            // function isEmail(str){
            //     var reg = /^[\u4E00-\u9FA5\uf900-\ufa2d\w]{4,16}$/;
            //     return reg.test(str);
            // }
            // var str = '超级无敌用户名regExp';
            // var str2 = '捣乱的@';
            // var str3 = '太短'
            // var str4 = '太长longlonglonglonglonglonglonglong'
            // document.write(isEmail(str)+'<br />');
            // document.write(isEmail(str2)+'<br />');
            // document.write(isEmail(str3)+'<br />');
            // document.write(isEmail(str4)+'<br />');
            // 12.还是有效性验证
            // function testReg(reg,str){
            //     return reg.test(str);
            // }
            // var reg = /^[a-zA-Z][\.a-zA-Z\s,0-9]*?[a-zA-Z]+$/;
            // var str = 'No.8,ChangAn Street,BeiJing,China';
            // var str2 = '8.No,ChangAn Street,BeiJing,China';
            // var str3 = 'No.8,ChangAn Street,BeiJing,China88';
            // document.write(testReg(reg,str)+'<br />')
            // document.write(testReg(reg,str2)+'<br />')
            // document.write(testReg(reg,str3)+'<br />')
            // 13.价格匹配
            // 开头数字若干位，可能有一个小数点，小数点后面可以有两位数字。hansir给出的对应正则：
            // /^(\d*\.\d{0,2}|\d+).*$/
            // 14. 开头是14位或者17位数字，结尾可以是数字或者是x或者是X。
            // /^(\d{14}|\d{17})(\d|[xX])$/
            // 15. 单词首字母大写
            // function replaceReg(reg,str){
            //     str = str.toLowerCase();
            //     return str.replace(reg,function(x){return x.toUpperCase()})//replace 高级用法
            // }
            // var reg = /\b(\w)|\s(\w)/g;
            // var str = 'blue idea';
            // var str2 = 'BLUE IDEA';
            // var str3 = 'Test \n str is no good!';
            // var str4 = 'final test';
            // document.write(replaceReg(reg,str)+'<br />');
            // document.write(replaceReg(reg,str2)+'<br />');
            // document.write(replaceReg(reg,str3)+'<br />');
            // document.write(replaceReg(reg,str4)+'<br />');
            // 16.日期验证 yyyy-mm-dd 或 yyyy/mm/dd
            // /^\d{4}(-|\/)\d{1,2}(-|\/)\d{1,2}$/
            // 17. 邮箱的有效性验证
            //  /^[A-Za-z\d]+([-_\.][A-Za-z\d]+)*\+?@(([A-Za-z\d]-?){0,62}[A-Za-z\d]\.)+[A-Za-z\d]{2,5}$/

            // function anchorText(str){
            //     var reg = /<a\s(?:\s*\w*?\s*=\s*".+?")*(?:\s*href\s*=\s*".+?")(?:\s*\w*?\s*=\s*".+?")*\s*>([\s\S]*?)<\/a>/;
            //     str = str.replace(reg,'$1');
            //     return str;
            // }
            // 18. 取标签中的内容
            // var str = '<a id = "test" href="http://bbs.blueidea.com" title="无敌">经典论坛</a>';
            // 匹配a 标签的正则
            // var reg = /<a\s(\s*\w*?\s*=\s*".+?")*(\s*href\s*=\s*".+?")(\s*\w*?\s*=\s*".+?")*\s*>([\s\S]*?)<\/a>/;
            // var arr = str.match(reg);
            // for (var i = 0; i < arr.length; i++) {
            //     alert(arr[i]);
            // }
            //小括号(?:) 表示不捕获
            // var reg = /<a\s(?:\s*\w*?\s*=\s*".+?")*(?:\s*href\s*=\s*".+?")(?:\s*\w*?\s*=\s*".+?")*\s*>([\s\S]*?)<\/a>/;
            // console.log(str.replace(reg,"$1"));
            // 19.判断一个标签是否闭合,没有考虑标签嵌套
            // var patt = /<([a-z]+)(\s*\w*?\s*=\s*".+?")*(\s*?>[\s\S]*?<\/\1>)+|\s*\/>/i;
            // var text = "<div>aaaaaa<div>test</div>";
            // var arr = text.match(patt);
            // for (var i = 0; i < arr.length; i++) {
            //     alert(arr[i]);
            // }
            // 20.要求匹配指定标签内容，而且指定父标签
            // var text = "<channel><title>蓝色理想</title></channel> <item> <title>界面设计测试规范</title> </item> <item> <title>《古典写实美女》漫画教程</title> </item> <item> <title>安远――消失的光年</title> </item> <item> <title>asp.net 2.0多语言网站解决方案</title> </item>";
            // var patt = /<title>[^<>]*?<\/title>(?!\s*<\/channel>)/gi;
            // //这里的(?!)表示不匹配<channel>标签
            // var arr = text.match(patt);
            // for (var i = 0; i < arr.length; i++) {
            //     console.log(arr[i]);
            // }
            // 21.匹配由字母数字组合，不能使用\w
            // function istrue(str){
            //     var reg=/^([a-z]+(?=[0-9])|[0-9]+(?=[a-z]))[a-z0-9]+$/ig;
            //     return reg.test(str);
            // }
            // var str = 'AaBc';
            // var str2 = 'aaa123';
            // var str3 = '123dd';
            // var str4 = '1230923403982';
            // document.write(istrue(str)+'<br />');
            // document.write(istrue(str2)+'<br />');
            // document.write(istrue(str3)+'<br />');
            // document.write(istrue(str4)+'<br />');
            // 22. 变量替换
            // var _A = ['A','B','C','D'];
            // var _B = '<ul><li>$0$</li><li>$1$</li><li>$2$</li><li>$3$</li><li>$4$</li></ul>';
            // var patt = /\$\d\$/g;
            // // 结果：_C = '<ul><li>A</li><li>B</li><li>C</li><li>D</li></ul>';
            // var _C = _B.replace(patt,function(x){
            //     console.log(x);
            //     var index = x.replace(/\$/g,'');
            //     console.log(index);
            //     if(index < _A.length) {
            //         return _A[index];
            //     }else {
            //         return "";
            //     }
            // });
            // console.log(_C);
            // 23. 正则表达式查找替换
            // var text = "<td align=\"center\"><img src=\"../photo/ccg/thumbnails/O'Malley's West_jpg.gif\" border=\"0\"onClick=\"MM_openBrWindow('../photo/ccg/pages/O'Malley's West_jpg.htm','BE','width=386,height=306')\"><br> O'Malley's West</td>";
            // // 要求将所有onclick属性中的’替换成\’，也就是将单引号转义。
            // var patt = /onclick\s*=\s*".+?"/ig
            // var result = text.replace(patt,function(x){
            //     return x.replace(/\'/,"\\'");
            // });
            // console.log(result);
            // 24. 阿拉伯数字变成中文大写
            // var text = "1392569220";
            // var arr = new Array("零","壹","贰","叁","肆","伍","陆","柒","捌","玖");
            // var patt =/\d/g;
            // var result = text.replace(patt,function(x){
            //     return arr[x];
            // });
            // 25. 从HTML代码段删除指定标签极其内容
            // /<(script|head|%)[\s\S]*?\/\1>/ig

    </script>
</body>
</html>

posted on 2017-09-27 00:03 卜戈的博客阅读(152) 评论(1) 收藏举报

刷新页面返回顶部

风清扬

导航

公告

JavaScript 正则表达式