zoukankan html css js c++ java

JavaScript 正則表達式

一、简单介绍
1、什么是正則表達式
正則表達式本身就是一种语言，这在其他语言是通用的。

正則表達式(regular expression)描写叙述了一种字符串匹配的模式，能够用来检查一个串是否含有某种子串、将匹配的子串做替换或者从某个串中取出符合某个条件的子串等。

str.indexOf(‘abc’); //精确匹配仅仅能匹配字符串“abc”
正則表達式 //模糊匹配

Where name=’zhangsan’; //精确匹配
Where name like ‘zhang%’; //姓名以zhang開始的字符串

2、为什么使用正則表達式
1）验证邮箱
2）手机号
3）银行卡号
4）採集器
186lO659839
5）中奖信息 186****9839
6）屏蔽特殊词汇

3、高速入门
1）查找一个字符串中是否具有数字“8”
2）查找一个字符串中是否具有数字

    /*var str='hello,javascript,php';
    var reg=/d/gi;
    alert(reg.test(str));*/

3）查找一个字符串中是否具有非数字

    var str='1861o659839';
    var reg=/D/gi;
    alert(reg.test(str));

二、正则对象

要使用正則表達式，必须要在程序创建正则对象
1、怎样创建正则对象？
我们须要得到一个RegExp类的实例

1）隐式创建
var 对象=/匹配模式/匹配标志; ‘’ [] {}

        /*var reg=/d/gi;
        alert(typeof reg);
        alert(reg.constructor);*/

2）直接实例化
var 对象=new RegExp(“匹配模式”,’匹配标志’);

        var reg=new RegExp("abcd",'gi');
        alert(typeof reg);
        alert(reg.constructor);

以上两种使用方法差别：
Var reg=/d/gi;

假设使用直接实例化。那么像“d”这种字符。须要转义”d”。例如以下：
Var reg=new RegExp(“\d”,”gi”);

2、匹配标志：
g：全局匹配
i：忽略大写和小写

三、怎样使用正则对象
在js中，使用正则对象主要有两种使用方法：

1、RegExp类
test(str) ：匹配指定的模式(參数)是否出如今字符串中（返回有没有）
reg.test(str);
exec(str) ：返回匹配模式的字符串 （复杂，返回详细内容）
reg.exec(str);

2、Sring类
search ：匹配符合匹配模式的字符串出现的位置。没有匹配到则返回-1
str.search(reg);
match ：以数组形式返回匹配模式的字符串，没有匹配到则返回null
str.match(reg);
replace ：使用指定的内容替换匹配模式的字符串
str.replace(reg,”content”);（两个參数）
split ：使用匹配模式的字符串做为分隔符对字符串进行切割，返回数组
str.split(reg);

<head>
    <script language='javascript' src='public.js'></script>
    <script>
        window.onload=function(){
            $('btn1').onclick=function(){
                var content=$('content').value;
                var reg=/ddd/i;
                var result=reg.test(content);
                alert(result);
            };

            $('btn2').onclick=function(){
                var content=$('content').value;
                var reg=/ddd/g;
                var result;
                while(result=reg.exec(content)){
                    alert(result);
                }
            };
            $('btn3').onclick=function(){
                var content=$('content').value;
                var reg=/ddd/gi;
                var result=content.search(reg);
                alert(result);
            };
            $('btn4').onclick=function(){
                var content=$('content').value;
                var reg=/ddd/gi;
                var result=content.match(reg);
                alert(result);

            };
            $('btn5').onclick=function(){
                var content=$('content').value;
                var reg=/d/gi;
                var result=content.replace(reg,'*');
                alert(result);
            };
            $('btn6').onclick=function(){
                var content=$('content').value;
                var reg=/ddd/gi;
                var result=content.split(reg);
                alert(result);
            };
        };
    </script>
</head>
<body>
<input type='text' id='content' size=50>
<br>
<br>
<input type='button' id='btn1' value='test'>
<input type='button' id='btn2' value='exec'>
<input type='button' id='btn3' value='search'>
<input type='button' id='btn4' value='match'>
<input type='button' id='btn5' value='replace'>
<input type='button' id='btn6' value='split'>
</body>

RegExp

test
exec

String

Search
Match
Replace
Split

不同的情况下使用不同的方法
如：
我想知道邮箱格式、手机格式、IP格式合不合法，用test
假设想抓取网页中全部的手机号。使用exec或match
想替换掉网页中敏感词汇，用replace

四、几个重要的概念

子表达式

在正则匹配模式中，使用一对括号括起来的内容是一个子表式

捕获

在正则匹配模式中，子表达式匹配到的内容会被系统捕获至系统的缓冲区中

反向引用（后向引用）

捕获之后，能够在匹配模式中，使用 (n：数字)来引用系统的第n号缓冲区内容
这里写图片描写叙述
例1：

匹配多个字符后面是三个数字。后面的内容和前面多个字符同样，
如：abc123abc

var str='aaaphp123phpaaajavascript589javascriptaasma470smbaa';
var reg=/(w+)ddd1/gi;
var result=str.match(reg);
alert(result);*/

例2：习题：

查找连续的四个数字。如：3569
var reg=/dddd/gi; d{4}
查找连续的同样的四个数字，如：1111
var reg=/(d)111/gi;
查找数字，如：1221,3443
Var reg=/(d)(d)21/gi;
查找字符，如：AABB,TTMM
Var reg=/(w)1(w)2/gi;
查找连续同样的四个数字或四个字符
Var reg=/(w)111/gi;

普通情况，后面的内容要求与前面的一致。就会用到子表达式、捕获、反向引用的概念

例3：在一个字符串，查找一对html标记以及中间的内容(好样例)

var str='adsfsadf<div>商品</div>adsflkj<p>100.00</p>sadfsadf';
var reg=/<(w+)>.+</1>/gi;
alert(str.match(reg));

例4：关于子表达式和exec方法

<script> 

    var str='ad1221sdsalkf4554sadlkj7667fsad1234fds';
    var reg=/(d)(d)21/gi;
    var result;
    while(result=reg.exec(str)){
        alert(result);
        //result[0] ==>1221
        //result[1] ==>1
        //result[2] ==>2 

        //.......
    }



    /*var str='aaaphp123phpaaajavascript589javascriptaasma470smbaaa';
    var reg=/(w+)(d)dd1/gi;
    var result;
    while(result=reg.exec(str)){
        alert(result);
    }*/
    //每一次匹配都放到一个数组中
    //数组结构：
    //result[0] ====> php123php
    //result[1] ====> 第一个子表达式匹配的结果 php
    //result[2] ====> 第二个子表达式匹配的结果  1

    //result[0] ====> javascript589javascript
    //result[1] ====> javascript
    //result[2] ====> 5
</script>

exec方法和match方法的比較：
Exec方法是RegExp类下的方法
Match是String下的方法

Match方法直接返回一个数组
Exec方法须要使用循环重复调用

假设有子表达式，exec方法会将子表达式的捕获结果放到数组相应的数组元素中

五、正则语法细节

正則表達式是由普通字符（比如字符 a 到 z）以及特殊字符（称为元字符）组成的文字模式。正則表達式作为一个模板，将某个字符模式与所搜索的字符串进行匹配。

正則表達式的构成：

1）普通字符：a b c d 1 2 3 4 ……..
2）特殊字符（元字符）：d D w . …….

我们在写正則表達式的时候。须要确定这样几件事：

1）我们要查什么
2）我们要从哪查
3）我们要查多少

1、限定符
限定符能够指定正則表達式的一个给定组件必须要出现多少次才干满足匹配。

* — 匹配前面的组件零次或多次
+ — 匹配前面的组件一次或多次
?

— 匹配前面的组件零次或一次
{n} — 匹配确定的 n 次
{n,} — 至少匹配n 次
{n,m} — 最少匹配 n 次且最多匹配 m 次

也能够使用下面方式表示：

* == {0,}
+ =={1,}
?

=={0,1}

代码：

例1：
这里写图片描写叙述

结果：
这里写图片描写叙述

例2：
这里写图片描写叙述
结果：

例3：

这里写图片描写叙述

结果：
这里写图片描写叙述

d{3,5} ：如在上题字符串中，既匹配三个，也能够匹配五个，那么，正則表達式中会自己主动匹配多的那一种，这在正则中贪婪匹配原则。

假设在表达式的后面使用”？”，表示非贪婪匹配原则，就会尽可能匹配少的，示比例如以下：

例4：

这里写图片描写叙述

{3,5}? 表示匹配3个
这里写图片描写叙述

2、字符匹配符

字符匹配符用于匹配某个或某些字符

字符簇
- [a-z] ：表示a-z随意一个字符
- [A-Z] ：表示A-Z随意一个字符
- [0-9] ：表示0-9随意一个数字
- [0-9a-z] ：表示0-9 a-z随意一个字符
- [0-9a-zA-Z] ：表示0-9 a-z A-Z随意一个字符
- [abcd] ：表示a 或b 或c 或 d
- [1234] ：表示 1 或2 或3 或 4
- [^a-z] ：表示匹配除了a-z之间随意一个字符
- [^0-9] ：表示匹配除了0-9之间随意一个字符
- [^abcd] ：表示匹配除a b c d 之外的随意一个字符
- d ：匹配一个数字字符。[0-9]
- D ：匹配一个非数字字符。[^0-9]
- w ：匹配包含下划线的不论什么单词字符。[0-9a-zA-Z_]
- W ：匹配不论什么非单词字符。[^w]
- s ：匹配不论什么空白字符空格、制表符、换行符
- S ：匹配不论什么非空白字符。
- . ：匹配除 “ ” 之外的不论什么单个字符假设想匹配随意字符 [. ]

3、定位符

定位符能够将一个正則表達式固定在一行的開始或结束。也能够创建仅仅在单词内或仅仅在单词的開始或结尾处出现的正則表達式。
^ 匹配输入字符串的開始位置
$ 匹配输入字符串的结束位置
匹配一个单词边界
B 匹配非单词边界

例1：

<script>

    var str='hello,php!你好JavaScript_,123,javA!';
    //var reg=/[0-9]/gi;    //1,2,3
    //var reg=/[A-Z]/g;     //J,S,A 注意：这里没有i标识
    //var reg=/[hp2r]/g;    //h,p,h,p,r,p,2 
    //var reg=/[^a-z2]/g;   //匹配除了a-z和数字2之外的随意一个字符  
    //var reg=/D/g;        //匹配非数字
    //var reg=/w/gi;       // 匹配大写和小写字母、数字、下划线
    var reg=/./gi;          //匹配全部字符，除了

    alert(str.match(reg));

</script>

例2：验证年龄

<script>

    /*var str='18';
    var reg=/^dd$/gi;
    alert(reg.test(str));*/

</script>

4、转义符

用于匹配某些特殊字符

例1：

    var str='hello,my name is .zhangsan.';
    var reg=/./gi;
    alert(str.match(reg));

上题中。假设直接使用 /./ 匹配的是随意一个字符。我们仅仅想匹配字符‘.’，所以须要转义
须要的转义字符：
(
)
[
]
{
}

.
/
*
+
?
^
$

5、选择匹配符
| 能够匹配多个规则
代码：

<script>

var str='hello,javascript.hello,php.';
    //var reg=/hello,javascript|php/gi; 
    //hello,javascript,php
var reg=/hello,(javascript|php)/gi; 
    //hello,javascript,hello,php
alert(str.match(reg));


</script>

六、关于正則表達式的几种特殊使用方法

1、(?

正向预查

2、 (?!)
负向预查

3、 (?:)

匹配内容，结果不被捕获

script>

    /*var str='李东超好人,李东超大侠。李东超帅哥！';
    //我想查询不是“好人”前面的名字
    var reg=/李东超(?!好人)/gi;
    alert(str.match(reg));
    alert(RegExp.lastIndex);*/

    var str='hellojavascript,hellophp,hellojava,helloajax';
    var reg=/hello(?:javascript|php)/gi;
    var result;
    while(result=reg.exec(str)){
        alert(result);
    }

</script>

上题中，(javascript|php)会被当做子表达式来处理，内容会被捕获。但在程序中，捕获的内容没有不论什么用途，这种情况下。能够使用（?

:）符合。让系统不去捕获子表达式匹配的内容

七、正则学习工具
这里写图片描写叙述
代码：

<head>
    <script language='javascript' src='public.js'></script>
    <script>
        window.onload=function(){

            $('btn1').onclick=function(){
                var content=$('content').value;
                var exp=$('exp').value;
                var reg=eval('/'+exp+'/gi');
                var result=reg.test(content);
                $('result').value=result;
            };

            $('btn2').onclick=function(){
                var content=$('content').value;
                var exp=$('exp').value;
                var reg=eval('/'+exp+'/gi');
                var result;
                $('result').value='';
                while(result=reg.exec(content)){
                    $('result').value+=result+'
';
                }
            };
            $('btn3').onclick=function(){
                var content=$('content').value;
                var exp=$('exp').value;
                var reg=eval('/'+exp+'/gi');
                $('result').value=content.search(reg);

            };
            $('btn4').onclick=function(){
                var content=$('content').value;
                var exp=$('exp').value;
                var reg=eval('/'+exp+'/gi');
                $('result').value=content.match(reg);
            };
            $('btn5').onclick=function(){
                var content=$('content').value;
                var exp=$('exp').value;
                var reg=eval('/'+exp+'/gi');
                $('result').value=content.replace(reg,'*');
            };
            $('btn6').onclick=function(){
                var content=$('content').value;
                var exp=$('exp').value;
                var reg=eval('/'+exp+'/gi');
                $('result').value=content.split(reg);
            };

        };
    </script>
</head>
<body>
内容：<input type='text' id='content' size=60><br><br>
正则：<input type='text' id='exp' size=40><br><br>
结果：<textarea id='result' cols='60' rows='8'></textarea><br><br>
<input type='button' id='btn1' value='test'>
<input type='button' id='btn2' value='exec'>
<input type='button' id='btn3' value='search'>
<input type='button' id='btn4' value='match'>
<input type='button' id='btn5' value='replace'>
<input type='button' id='btn6' value='split'>
</body>

八、正则习题：
1、验证手机号是否有效

    var str='13890008000';
    var reg=/^13[0-35-9]d{8}$/gi;
    if(reg.test(str)){
        alert('合法');
    }else{
        alert('不合法');
    }

2、验证邮箱是否有效

    var str='zhang.san@163.com.com.com.cn';
    var reg=/^[w.]+@(w+.)+[a-z]{2,4}$/gi;
    if(reg.test(str)){
        alert('合法');
    }else{
        alert('不合法');
    }

3、验证ip地址是否有效

    /*1.1.1.1    
    0--255
    第一个段不能是0
    不能以0开头  如：086*/

    var str='1.1.1.1';
    var reg=/^([1-9]|[1-9][0-9]|1[0-9][0-9]|
    2[0-4][0-9]|25[0-5])(.([0-9]|[1-9][0-9]
    |1[0-9][0-9]|2[0-4][0-9]|25[0-5])){3}$/gi;

    if(reg.test(str)){
        alert('合法');
    }else{
        alert('不合法');
    }

九、结巴程序

结巴程序

我…我是是..一个个…帅帅帅帅…哥!”;

我是一个帅哥。

replace();

Try…catch语句

例1：

    var str='我我我...我我...是是...一一个个个个...帅帅帅帅帅帅帅帅帅帅哥！';
    var reg=/./gi;
    //将全部.替换成空
    str=str.replace(reg,'');
    alert(str);
    //我我我我是是是是一个个个
    reg=/(.)1+/gi;
    //使用1号缓冲区内容替换重复的内容
    str=str.replace(reg,'$1');
    alert(str);

display()函数未定义，运行第5行代码时。出错，会被catch语句捕获，错误的相关信息会被保存到对象e中

例2：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Descriptio


                
                  查看全文


              
              

                相关阅读:

                
                  HTML 中的几种空格字符
                    
css第二天
                    
css第一天
                    
html第二天
                    
html 第一天
                    
javaScript
                    
数据类型扩展
                    
Hello world可能遇到的问题
                    
卸载安装jdk的步骤与问题
                    
windows常用快捷键和Dos命令
                    
                
              
              
              
                原文地址：https://www.cnblogs.com/zhchoutai/p/7222276.html




          
          
            
              
                最新文章
              
              
                
                  手机用fiddler抓包的配置步骤
                    
24、数据库安全001--数据库漏扫
                    
23、所有软件缺陷都要修复么？都能被修复么？
                    
22、BUG类型、等级、优先级
                    
21、开发人员认为不是BUG时，你要如何处理？
                    
20、如何减少问题发生（待补充）
                    
19、请教你都不会，你还会做什么？
                    
18、产品测试流程
                    
17、工作中及时反馈很重要，测试岗位如何保证做好及时反馈工作？
                    
16、技术人员老是犯低级错误，针对该情况你会如何处理？
                    
                
              
            

            
              
                热门文章
              
              
                
                  15、最基础的执行都做不好，其他皆浮云 。
                    
Vue的进化——Vue3与Vue2在应用中的区别
                    
前端代码规范剪辑
                    
Vue 自定义的几个指令
                    
JavaScript XHR的用法和自定义封装
                    
JavaScript 一些常用的js处理方法整理
                    
DOM图片显示优化处理
                    
Javascript 移动端字体适配处理（rem2px）
                    
JavaScript数据类型之Number类型
                    
NPM 的使用介绍


      


      

      
        
          Copyright © 2011-2022 走看看