正则表达式

最新推荐文章于 2023-04-13 11:14:30 发布

置顶 Andrelia20171760

最新推荐文章于 2023-04-13 11:14:30 发布

阅读量378

点赞数

分类专栏： # JavaScript 文章标签：正则表达式

本文链接：https://blog.csdn.net/Andrelia20171760/article/details/102686553

版权

JavaScript 专栏收录该内容

21 篇文章 1 订阅

订阅专栏

正则表达式

正则表达式:也叫规则表达式,按照一定的规则组成的一个表达式,这个表达式的作用主要是匹配字符串的
“我的电话:10086,他的电话:10010,你的电话:10000” 正则表达式,把这个字符串中的所有的数字找到
正则表达式的作用:匹配字符串的
在大多数编程语言中都可以使用
正则表达式的组成:是由元字符或者是限定符组成的一个式子

正则表达式语法

元字符:

  - .  表示的是:除了\n以外的任意的一个字符 
  - [] 表示的是:范围
     -  [0-9] 表示的是0到9之间的任意的一个数字  "789" [0-9]
     - [1-7] 表示的是1到7之间的任意的一个数字
     - [a-z] 表示的是:所有的小写的字母中的任意的一个
     - [A-Z] 表示的是:所有的大写的字母中的任意的一个
     - [a-zA-Z] 表示的是:所有的字母的任意的一个
     - [0-9a-zA-Z] 表示的是: 所有的数字或者是字母中的一个
  - [] 另一个函数: 把正则表达式中元字符的意义干掉 
      - [.]此时的点就是一个点不再是除了\n以外的任意的一个字符
      - [-]就是-这个符号
      - [9]就是9这个数
  - | 或者
      - [0-9]|[a-z] 表示的是要么是一个数字,要么是一个小写的字母
  - () 分组 提升优先级，主要应用在限制多选结构的范围/分组/捕获文本/环视/特殊模式处理
      - 提取日期中的日`var array=str.match(/(\d{4})[-](\d{2})[-](\d{2})/g);` `console.log(RegExp.$3);` 将年月日分在不同的组，匹配后打印日那个组
  - *  表示的是:前面的表达式出现了0次到多次
  - +  表示的是:前面的表达式出现了1次到多次
  - ?  表示的是:前面的表达式出现了0次到1次,最少是0次,最多1次 ,另一个含义:阻止贪婪模式

**限定符：**限定前面的表达式出现的次数

  - {} 更加的明确前面的表达式出现的次数
  - {0,} 表示的是前面的表达式出现了0次到多次,和 *一样的
  - {1,} 表示的是前面的表达式出现了1次到多次,和 +一样的
  - {0,1} 表示的是前面的表达式出现了0次到1次,和 ?一样的
  - {5,10} 表示的是前面的表达式出现了5次到10次 
  - {4} 前面的表达式出现了4次
  - {,10} 错误的========不能这么写
  - ^ 表示的是以什么开始,或者是取非(取反)
      - ^[0-9] 以数字开头 
  - $ 表示的是以什么结束
  - ^$以...开头以...结尾这种组合是严格模式
      - ^[0-9][a-z]& 相当于是严格模式   "3f2432e"不行  "4f"满足条件，必须是以数字开头小写字母结尾而不仅仅是包含数字和小写字母 
  - \d 数字中的任意一个,
  - \D 非数字中的一个
  - \s 空白符中的一个
  - \S 非空白符
  - \w 非特殊符号   [a-zA-Z0-9_]（字母数字下划线都是非特殊符号） 下划线是非特殊符号
  - \W 特殊符号  = [^a-zA-Z0-9_]
  - \b 单词的边界

正则表达式案例

写正则表达式,根据字符串来写正则表达式进行匹配

经验: 1.找规律 2.不要追求完美

身份证的正则表达式

15位或者18位

([1-9][0-9]{14})|([1-9][0-9]{16}[0-9xX])

或者

([1-9][0-9]{14})([0-9]{2}[0-9xX])?

手机号码的正则表达式

130 131 132 133 134 135 136 137 138 139
143 147
150 151 152 153 154 155 156 157 158 159
170 171 173 176 177
180 181 182 183 184 185 186 187 188 189

([1][358][0-9][0-9]{8})
|([1][4][37][0-9]{8
|([1][7][01367][0-9]{8})

邮箱的正则表达式

sd2113_3.-fd@itcast.com.cn

[0-9a-zA-Z_.-]+[@][0-9a-zA-Z_.-]+([.][a-zA-Z]+){1,2}

表单的验证

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style type="text/css">
    body {
      background: #ccc;
    }

    label {
      width: 40px;
      display: inline-block;
    }

    span {
      color: red;
    }

    .container {
      margin: 100px auto;
      width: 400px;
      padding: 50px;
      line-height: 40px;
      border: 1px solid #999;
      background: #efefef;
    }

    span {
      margin-left: 30px;
      font-size: 12px;
    }

    .wrong {
      color: red
    }

    .right {
      color: green;
    }

    .defau {
      width: 200px;
      height: 20px;
    }

    .de1 {
      background-position: 0 -20px;
    }
  </style>

</head>

<body>
<div class="container" id="dv">
  <label for="qq">Q Q</label><input type="text" id="qq"><span></span><br/>
  <label>手机</label><input type="text" id="phone"><span></span><br/>
  <label>邮箱</label><input type="text" id="e-mail"><span></span><br/>
  <label>座机</label><input type="text" id="telephone"><span></span><br/>
  <label>姓名</label><input type="text" id="fullName"><span></span><br/>
</div>

<script>
  function my$( id ) {
      return document.getElementById( id );
    }
  //qq的
  checkInput(my$("qq"),/^\d{5,11}$/);
  //手机
  checkInput(my$("phone"),/^\d{11}$/);
  //邮箱
  checkInput(my$("e-mail"),/^[0-9a-zA-Z_.-]+[@][0-9a-zA-Z_.-]+([.][a-zA-Z]+){1,2}$/);
  //座机号码
  checkInput(my$("telephone"),/^\d{3,4}[-]\d{7,8}$/);
  //中文名字
  checkInput(my$("fullName"),/^[\u4e00-\u9fa5]{2,6}$/);
  //给我文本框,给我这个文本框相应的正则表达式,我把结果显示出来
  //通过正则表达式验证当前的文本框是否匹配并显示结果
  function checkInput(input,reg) {
    //文本框注册失去焦点的事件
    input.onblur=function () {
      if(reg.test(this.value)){
        this.nextElementSibling.innerText="正确了";
        this.nextElementSibling.style.color="green";
      }else{
        this.nextElementSibling.innerText="让你得瑟,错了吧";
        this.nextElementSibling.style.color="red";
      }
    };
  }

</script>

</body>
</html>

Andrelia20171760

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
正则表达式

正则表达式正则表达式:也叫规则表达式,按照一定的规则组成的一个表达式,这个表达式的作用主要是匹配字符串的“我的电话:10086,他的电话:10010,你的电话:10000” 正则表达式,把这个字符串中的所有的数字找到正则表达式的作用:匹配字符串的在大多数编程语言中都可以使用正则表达式的组成:是由元字符或者是限定符组成的一个式子正则表达式语法元字符: - ....
复制链接

扫一扫