Web前端——正则表达式和 jQuery

硝酸童不酸

于 2022-10-04 15:22:09 发布

阅读量328

点赞数 1

分类专栏： Web前端文章标签：前端正则表达式 jquery

本文链接：https://blog.csdn.net/qq_51594459/article/details/127160743

版权

Web前端专栏收录该内容

7 篇文章 0 订阅

订阅专栏

文章目录

一、定义正则表达式
- 1.普通方式
- 2.构造函数方式
二、表达式的模式
总结

一、定义正则表达式

正则表达式是一个描述字符模式的对象，它由一些特殊的符号组成。在 JavaScript 中，正则表达式有两种定义方式。

1.普通方式

语法：var reg = /模式/修饰符

2.构造函数方式

语法：var reg = new RegExp(“模式”，”修饰符”)

模式代表了某种规则，可以使用一些特殊符号来构成
修饰符用来扩展表达式的含义，主要有三个，并且可以任意组合
G: 表示全局匹配
I: 表示不区分大小写匹配
M: 表示可以进行多行匹配

创建完正则表达式后，可以使用test()方法来检测一个字符串是否匹配该模式
语法：reg.test(字符串)
测试代码1：

<script type="text/javascript">
	var reg = /wzu/i
	var s = "wdfdfaawertrfwZudfadfadf"
	alert(reg.test(s))
</script>

上述代码在 JavaScript 中定义了一个模式 reg，该模式用来匹配目标字符串中是否包含子串“wzu”，修饰符 i 表示匹配过程中忽略大小写。
测试代码2：

var reg1 = / ^wzu/gm
var s1 = " wzudfda\nwzu";
alert(s1.replace(reg1, "www"))

上述代码定义了一个模式 reg1，该模式用于匹配以“wzu”开头的字符串。其中字符串s1 存在符号“\n”是多行字符串，由于加了全局匹配和多行匹配修饰符，该模式会将每一行作为一个单独的字符串处理，因此上述代码返回结果“wwwdfda\nwww”，如果不加修饰符 g，则首次匹配成功后即返回。如果不加修饰符 m，则不支持多行匹配。

二、表达式的模式

正则表达式的模式一般分为简单模式和复合模式两种。
简单模式是指通过普通字符的组合来表达的模式，简单模式只能匹配普通字符串，不能满足复杂需求
复合模式是指通过利用通配符来表达语义的模式，常见的正则表达式符号有选择符和量词符

1.选择符

在这里插入图片描述

2.量词符

在这里插入图片描述

3.例子

身份证号码

我国身份证号码的规则为：
15 位或者 18 位
18 位最后一位可能为 X 或者数字
可定义正则表达式为:var reg = /^\d{15}(\d{2}[0-9xX])?$/
其中，d{15}表示前 15 位是数字，
？表示(\d{2}[0-9xX])这一部分可出现 0 次或 1 次，该部分前 2 位是数字，最后 1 位是字符 x 或 X。

电子邮箱

验证电子邮箱是否符合规则的正则表示可定义如下
var reg = /^\w+@\w+(\.[A-z]{2,3}){1,2} $/
其中，^\w+表示邮箱必须以数字、字母或者下划线开头并且可以出现多次，
@\w+表示必须出现@符号，并且之后必须跟 1 次或多次数字、字母或者下划线。
\.[A-z]{2,3}表示“.”号后面跟 2~3 个字母，其中“.”是正则表达式保留字，因此需要使用“\”进行转义

测试代码：

<script>
    $(function () {
        $("input[name='identify']").blur(function () {
            var idf = $(this).val();
            var reg = /^\d{15}(\d{2}[0-9xX])?$/;
            if(reg.test(idf) === false){
                $("#idfInfo").html("身份证号码不正确，请重新输入")
            }else{
                $("#idfInfo").html("")
            }
        })
    })
</script>
<body>
    <span>请输入身份证号</span>
    <input type="text"  name="identify">
    <span id="idfInfo"></span>
</body>