0
点赞
收藏
分享

微信扫一扫

3-25 javascript

Ewall_熊猫 2022-03-25 阅读 72

3-25 javascript

正则表达式

  • 正则表达式用于定义一些字符串的规则,计算机可以根据正则表达式,来检查一个字符串是否符合规则,将字符串中符合规则的内容提取出来
  • 创建正则表达式的对象,var 变量 = new RegExp( “正则表达式” , “匹配模式”) ;
  • 正则表达式的方法:test( )
    使用这个方法可以用来检查一个字符串是 否符合正则表达式的规则,如果符合则返回true,否则返回false
    • 在构造函数中可以传递一个匹配模式作为第二个参数,可以是
      i忽略大小写
      g全局匹配模式
    • 可以为一个正则表达式设置多个匹配模式,且顺序无所谓
// 创建一个正则表达式的对象
var reg = new RegExp("a");//此正则表达式用于检查字符串中是否含有a
var str = "a";

// 正则表达式的方法test()
var result = reg.test(str);
console.log(result);
  • 使用字面量来创建正则表达式 , var变量= /正则表达式/匹配模式
// 使用字面量来创建正则表达式
var reg = /a/i;
console.log(reg.test("Abc"));//true
//创建一个正则表达式, 检查一个字符串中是否有 a或b
var reg = /a|b///|表示或
var reg = /[ab]///[]里的内容也是或的关系
console.log(reg.test("bcd"));//true
console.log(reg.test("acd"));//true

  • /a|b/用|表示或
  • /[ab]/[]里的内容也是或的关系
  • [a-z]任意小写字母,[A-Z] 任意大写字母,[A-z]任意字母
  • [^]表示除了
  • [0-9] 任意数字
其他正则表达式规则

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ZoilzIMZ-1648219513724)(C:\Users\陌然\AppData\Roaming\Typora\typora-user-images\image-20220325220450309.png)]

String方法与正则表达式

split()

  • 可以将一个字符串拆分为一个数组
  • 方法中可以传递一个正则表达式作为参数,这样方法将会根据正则表达式去拆分字符串
  • 这个方法即使不指定全局匹配,也会全都拆分
//根据任意字母来将字符串拆分
var str = "1a2c3s4d5f6g7"
console.log(str.split(/[A-z]/));//['1', '2', '3', '4', '5', '6', '7'] 

search()

  • 可以搜索字符串中是否含有指定内容
  • 如果搜索到指定内容,则会返回第一 次出现的索引,如果没有搜索到返回- 1
  • 它可以接受一个正则表达式作为参数,然后会根据正则表达式去检索字符串
  • serach( )只会查找第一个,即使设置全局匹配也没用
// 搜索字符串中是否含有指定内容
var str = "1212 hhh abc www";
console.log(str.search(/abc/));//9
console.log(str.search(/hello/));//-1 
console.log(str.search(/a[bcd]c/));//9

match()

  • 可以根据正则表达式,从一个字符串中将符合条件的内容提取出来
  • 默认情况下我们的match只会找到第一一个符合要求的内容,找到以后就停止检索,我们可以设置正则表达式为全局匹配模式,这样就会匹配到所有的内容
  • match( )会将匹配到的内容封装到一个数组中返回,即使只查询到一个结果
// match()
var str = "1a2c3s4d5f6g7";
var result = str.match(/[0-9]/g);
console.log(result);//['1', '2', '3', '4', '5', '6', '7']

replace()

  • 可以将字符串中指定内容替换为新的内容
  • 参数:1.被替换的内容 ,可以接受一一个正则表达式作为参数,2.新的内容
  • 默认只会替换第一个
// replace()
var str = "1a2c3s4d5f6g7";
var result = str.replace(/[A-z]/g,"@");
console.log(result);//1@2@3@4@5@6@7
var result = str.replace(/[0-9]/g,"");
console.log(result);//acsdfg

正则表达式语法

量词

  • 通过量词可以设置一个内容出现的次数
  • 量词只对它前边的一个内容起作用
  • {n}正好出现n次
  • {m,n}出现m- n次
  • {m,},m次以上
  • +至少一个,相当于(1,)
  • *,0个或多个相当于{0,}
  • ? 0个或1个,相当于{0, 1)
  • ^表示开头
  • $表示结尾
  • 如果在正则表达式中同时使用^ $则要 求字符串必须完全符合正则表达式
// 量词
var reg = /(ab){2}/;
console.log(reg.test("abcabcabc"));//false
console.log(reg.test("hhhabababhh"));//true
 var reg = /(ab){1,3}/;
console.log(reg.test("abcabcabc"));//true
console.log(reg.test("hhhababababhh"));//true
var reg = /^a$/;
console.log(reg.test("aaa"));//false
console.log(reg.test("a"));//true
        // 如果在正则表达式中同时使用^ $则要 求字符串必须完全符合正则表达式

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-4i7akWKN-1648219513726)(C:\Users\陌然\AppData\Roaming\Typora\typora-user-images\image-20220325220321164.png)]

转义字符

  • 在正则表达式中使用\作为转义字符
  • \.来表示.
  • \\表示\

注意:

  • 使用构造函数时,由于它的参数是一个字符串, 而\是字符串中转义字符,如果要使用\则需要使用\ \来代替

元字符

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-KCPDNKiX-1648219513727)(C:\Users\陌然\AppData\Roaming\Typora\typora-user-images\image-20220325220411577.png)]

去除字符串中的空格

//接收一个用户的输入
var str = prompt("快输入,别墨迹");
console.log(str);//"     he    llo      "
// 去除字符串中的空格
str = str.replace(/\s/g,"");
console.log(str);//hello
去除字符串中前后的空格
str = str.replace(/^\s*|\s*$/g,"");//匹配开头和结尾的空格
console.log(str);//he   llo

邮件的正则

  • 任意字母数字下划线(至少3) – \w{3,}
  • . – (\.
  • 任意字母数字 – \w+)*
  • @ – @{1}
  • 任意字母数字 – [A-z0-9]+
  • . – \.{1}
  • 任意字母(2-5)-- [A-z]{2,5}
  • . – \.{1}
  • 任意字母(2-5)-- \w{2,5}
 // 邮件正则
var emilReg = /^\w{3,}(\.\w+)*@{1}[A-z0-9]+(\.{1}[A-z]{2,5}){1,2}$/;
console.log(emilReg.test(str));//对了对了!!!!快乐!!!!(里边两个{1}可以不写)

DOM文档对象模型

文档

  • 文档表示的就是整个的HTML网页文档

对象

  • 对象表示将网页中的每一个 部分都转换为了一个对象。

模型

在这里插入图片描述
在这里插入图片描述

3-25 javascript练习:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" href="D:\wpp快好好学习\前端\代码\前端基础\bread.png" type="image/x-icon">
    <title>3-25 javascript练习</title>
    <script>
        // // 创建一个正则表达式的对象
        // var reg = new RegExp("a");//此正则表达式用于检查字符串中是否含有a
        // var str = "a";

        // // 正则表达式的方法test()
        // var result = reg.test(str);
        // console.log(result);

        // 使用字面量来创建正则表达式
        // var reg = /a/i;
        // console.log(reg.test("Abc"));//true

        //创建一个正则表达式, 检查一个字符串中是否有 a或b
        // var reg = /a|b/
        // console.log(reg.test("bcd"));//true
        // console.log(reg.test("acd"));//true

        // 检查是否含有字母
        // [a-z]任意小写字母,[A-Z] 任意大写字母,[A-z]任意字母

        // //根据任意字母来将字符串拆分
        // var str = "1a2c3s4d5f6g7"
        // console.log(str.split(/[A-z]/));//['1', '2', '3', '4', '5', '6', '7'] 

        // // 搜索字符串中是否含有指定内容
        // var str = "1212 hhh abc www";
        // console.log(str.search(/abc/));//9
        // console.log(str.search(/hello/));//-1
        // console.log(str.search(/a[bcd]c/));//9
        
        // match()
        // var str = "1a2c3s4d5f6g7";
        // var result = str.match(/[0-9]/g);
        // console.log(result);//['1', '2', '3', '4', '5', '6', '7']

        // // replace()
        // var str = "1a2c3s4d5f6g7";
        // var result = str.replace(/[A-z]/g,"@");
        // console.log(result);//1@2@3@4@5@6@7
        // var result = str.replace(/[0-9]/g,"");
        // console.log(result);//acsdfg

        // // 量词
        // // var reg = /(ab){2}/;
        // // console.log(reg.test("abcabcabc"));//false
        // // console.log(reg.test("hhhabababhh"));//true
        // // var reg = /(ab){1,3}/;
        // // console.log(reg.test("abcabcabc"));//true
        // // console.log(reg.test("hhhababababhh"));//true
        // var reg = /^a$/;
        // console.log(reg.test("aaa"));//false
        // console.log(reg.test("a"));//true
        // // 如果在正则表达式中同时使用^ $则要 求字符串必须完全符合正则表达式

        // //接收一个用户的输入
        var str = prompt("快输入,别墨迹");
        // console.log(str);//"     he    llo      "
        // // 去除字符串中的空格
        // // str = str.replace(/\s/g,"");
        // // console.log(str);//hello
        // // 去除字符串中前后的空格
        // str = str.replace(/^\s*|\s*$/g,"");//匹配开头和结尾的空格
        // console.log(str);//he   llo

        // 邮件正则
        var emilReg = /^\w{3,}(\.\w+)*@{1}[A-z0-9]+(\.{1}[A-z]{2,5}){1,2}$/;
        console.log(emilReg.test(str));//对了对了!!!!快乐!!!!
</script>
</head>

<body>

</body>

</html>
举报

相关推荐

0 条评论