zoukankan      html  css  js  c++  java
  • js正则表达式及RegExp转义踩坑实录

    js正则表达式及RegExp转义踩坑实录

    //"12[3456".match(/12[/g)
    //new RegExp("12\[","gm").test("212[1ss2s")


    交代本文背景
    1.写一个css文件,做笔记的时候用了js的//注释,应该用/* */注释才对的,运行的话要删除之前的注释,这里列举部分篇幅。

    // :root -> 获取根元素html
    :root {
    // 这些是变量,可以在别的地方使用,像font-size: var(--large-size);
    --color-text: #666; // 文字颜色
    --color-high-text: #ff5777; // 文字高亮颜色
    --color-tint: #ff8198; // 背景颜色
    --color-background: #fff;
    --font-size: 14px;
    --line-height: 1.5;
    }
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    2.现在想要在浏览器控制台F12写些代码删掉整段css代码的注释。思路是:我每个注释都是以"//+空格"开头的,我只要把所有同一行内"//+空格"后面的内容去掉即可。下面开始在控制台写js代码。

    // 定义个str保存我写的css代码
    let str = `// :root -> 获取根元素html
    :root {
    // 这些是变量,可以在别的地方使用,像font-size: var(--large-size);
    --color-text: #666; // 文字颜色
    --color-high-text: #ff5777; // 文字高亮颜色
    --color-tint: #ff8198; // 背景颜色
    --color-background: #fff;
    --font-size: 14px;
    --line-height: 1.5;
    }`;

    // 字符串分割成数组strArr,以换行符分隔
    let strArr = str.split(' ');

    // 定义正则表达式,表达式有挺多表示方法的,下面几个注释掉的作用是一样的
    // let regex = ///s.*/g;
    // let regex = new RegExp("// .*","g");
    // let regex = new RegExp(///s.*/,"g");
    let regex = new RegExp('//\s.*','g');

    // 定义新数组ansArr装删去注释的strArr数组
    let ansArr = strArr.map(x => {
    x = x.replace(regex, '');
    return x
    })

    // 数组转成字符串,以换行符连接
    let ansStr = ansArr.join(' ')

    // 打印,复制内容即可
    console.log(ansStr);

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    问题与总结
    正则表达式可以写在斜杠内,用**/正则表达式/表示,也可以用双引号"正则表达式"**表示。但是这两种方法写正则表达式有坑:

    用斜杠**/正则表达式/**表示时,正则表达式内的斜杠/需要转义,反斜杠、双引号"、不需要转义,例如我想写"//+空格+以后任何内容",我就要写成///s.*/
    用双引号**“正则表达式”**表达正则表达式时,**斜杠/不需要转义,反斜杠、双引号"需要转义,**例如我想写"//+空格+以后任何内容",我就要写成“//\s.*”
    ————————————————
    版权声明:本文为CSDN博主「一条小罗非」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
    原文链接:https://blog.csdn.net/weixin_38689203/article/details/104601650

  • 相关阅读:
    (组件、路由)懒加载
    vue.js实现用户评论、登录、注册、及修改信息功能
    vue 路由传参 params 与 query两种方式的区别
    WebSocket入门教程(五)-- WebSocket实例:简单多人聊天室
    js系列教程11-json、ajax(XMLHttpRequest)、comet、SSE、WebSocket全解
    回忆一下跨域
    Http,Socket,TCP/IP 协议简述
    Vue+WebSocket 实现页面实时刷新长连接
    微信小程序JS导出和导入
    Vue学习之路之登录注册实例代码
  • 原文地址:https://www.cnblogs.com/chinasoft/p/15011539.html
Copyright © 2011-2022 走看看