《JavaScript第九章》

一、正则表达式简介


正则表达式(Regular Expression)是一种描述字符串规律的表达式,可以迅速地用极简单的方式达到字符串的校验控制。

符合一个正确的规则的表达式

正则表达式的应用:常用于数据校验,过滤敏感词  等等

二、 如何创建正则表达式


方法1 :直接声明  注意 任何情况下不要加引号

var reg1 = /aa/bb ;     //reg不仅有注册的意思 还有正则表达式的意思    

方法2 :  通过new声明   该放引号就放引号

var reg2 = new RegExp("aa","bb");

一般情况下使用方法1

解释正则表达式的参数是什么意思:

第一个参数,用于描述字符串特征,例如以什么开头,以什么结尾,包含什么字符。

第二个参数,用于描述额外的功能,例如是否忽略大小写(i)。是否全局匹配(g) 可以省略

全局匹配的意思:  一般情况下 匹配到一个就停止了.

例如:

var str = "aabbcc";//现在需要将a替换成你

console.log(str.replace("a","你"));//你abbcc

             

第一种方法:

var reg1 = /ab/;

第二种方法:

var reg2 = new RegExp('ab');

上述代码的意思 判断字符串是否包含 ab

如何去判断 通过正则表达式的test方法 :

var str = "你好123abacd";

console.log(reg1.test(str))//true

             

var reg = /ab/;

console.log(reg.test('abcd'));   // 输出结果:true

console.log(reg.test('dcba'));   // 输出结果:false

console.log(reg.test('Abcd'));   // 输出结果:false

一般来说都是通过test方法来判断字符串是否符合要求

其中还有一个方法也可以判断但是用的比较少       

var reg = /ab/;

console.log(reg.exec('cdab'));  

console.log(reg.exec('dcba'));  

console.log(reg.exec('Abcd'));

不同的是:返回值。exec返回的是一个数组,如果不匹配返回一个null。

如果匹配就返回出现的下标等。

三、正则表达式的元字符 


元字符是具有特殊含义的字符,例如[a-z]就表示所有小写字母。

第一个元字符  .   表示任意字符

例如:

var reg = /a./;

var str = "qwerta~";

console.log(reg.test(str));

           

第二个元字符    ^   表示以什么开头  必须放在第一个

例如:            

var reg = /^yyzy/;

var str = "yyzy123";

console.log(reg.test(str));

                   

第三个元字符    $   表示以什么结尾  必须放在最后第一个

例如:           

var reg = /yyzy$/;

var str = "yyzy123yyzy";

console.log(reg.test(str));

           

元字符之间是可以统一使用的

var reg = /^2023yyzy$/;这里的语法表示必须是2023yyzy  这里还不完善

var str = "2023yyzy";

console.log(reg.test(str));

           

           

下面两种写法的区别   i表示忽略大小写

var reg1 = /^ab$/i;//必须是ab

var reg2 = /ab/i;//只要包含ab即可

           

元字符之间是可以统一使用的

var reg = /^2023...yyzy$/;

var str = "2023ab啊yyzy";

console.log(reg.test(str));

           

正则表达式中的“[]”表示一个字符集合

只要待匹配的字符   符合字符集合中的某一项,即表示匹配成功。  

需要校验的字符串 必须要包含a或d或1或z

var reg = /[ad1z]/;

console.log(reg.test("aaaaa"));

           

常见的字符串集合:

var reg = /[a-z]/;

var reg = /[A-Z]/;

var reg = /[0-9]/;

var reg = /[a-zA-Z0-9]/;//所以非符号的字符

           

分别叙述两种写法的区别

var reg1 = /[abc123]/i;  //字符串中只要包含abc123 6个中的任意1个 即可

var reg2 = /abc123/i;    //字符串必要包含abc123的整体   

注意连字符必需要结合中括号一起使用

分别叙述两种写法的区别:

var reg1 = /[a-z]/i;

var reg2 = /a-z/i;

           

当需要匹配某个范围外的字符时,可以在“[”的后面加上“^”,

 此时“^”不再表示定位符,而是反义符,表示某个范围之外。

分别叙述两种写法的区别:

var reg1 = /^[a-z]/i;//必须是开头有一个字母

var reg2 = /[^a-z]/i;//必须包含非字母的

           

限定符  表示只允许出现的次数

var  reg1 = /a{6}/;

console.log(reg1.test("aaaaaab"))

           

必须是6个数字开头 然后紧紧跟着1~5个字母即可

var reg1 = /^[0-9]{6}[a-z]{1,5}[0-9]{1}$/i;

console.log(reg1.test("123456abf1"))

模拟需求  实现敏感词的过滤

var reg = /[习法西斯]/g;

var str = "你好作者。法西斯XX啊啊法国XX";

console.log(str.replace(reg,"*"));//你abbcc

四、正则表达式的表单校验


要求对输入的账号进行数据校验:

1.长度为10-20之间

2.必须以yyzy开头

3.必须以2023结尾

4.中间必须存在abcd字符串。

5.必须是复杂账号(大写字母,小写字母,数字,特殊符号必须至少含有3项)

需求如下:输入数据完成之后 失去焦点进行校验,如果校验通过则按钮恢复正常,反之给出相关的提示。

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

    </head>

   

    <body>

        用户名:<input type="text" id="username" />

        <span id="tip"></span> <!--存储提示信息 -->

        <br>

        <button id="btn" disabled="disabled">提交信息</button>

   

        <script>

     

            var input_username = document.getElementById("username");

            var span_text = document.getElementById("tip");

            var btn = document.getElementById("btn");

           

            input_username.onblur = function(){
                //第一步:获取文本值

                var username = input_username.value;

               

                var reg = /^(?=.*d)(?=.*[a-z])(?=.*[A-Z]).{8,10}$/

                              

            }

           

           

            input_username.onfocus = function(){
            span_text.innerText = "";

           

            btn.setAttribute("disabled","disabled");

              

            }

        </script>

    </body>

</html>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值