正则表达式（三）：一些例子

发表于 | 更新于: | 分类于 | | 阅读次数:
字数统计: 488字 | 阅读时长 ≈ 2分钟

下面是使用正则表达式的一些示例：

  1. 实现密码输入以英文字母开头， 密码长度为 8 到 16 位， 密码限为字符， 数字和下划线。
    1
    let pattern = /^[a-zA-a]\w{7, 15}/;
  2. 验证是否含有^%&'',;=?$"等字符
    1
    2
    let pattern = /[\^%&$".'=?]/;
    // "\" 用于转义 `^`
  3. 整数正则
  4. 1
    let pattern = /^-?\d+$/;
  5. 匹配数字， 小数点后最大两位小数
    1
    let pattern = /^\d+/.?\d{0, 2}$/;
  6. 手机号码的匹配
    1
    let pattern = /^1[34578]\d{9}$/;
  7. 匹配16进制颜色值
    1
    2
    3
    4
    // 比如匹配如下的颜色
    // #ffbbad  #Fc01DF  #FFF  #ffE
    let pattern = /[0-9a-fA-F]{6} | [0-9a-fA-F]{3}/;
    // 使用 | 用来表示正则表达式中分支结构
  8. 匹配 24 小时时间
    1
    2
    3
    // 例如匹配 23:59 和 02:12
    // 使用 () 对于正则表达式进行分组使用， 在 （） 内使用 | 只会作用到括号内的正则内容
    let pattern = /^([01][0-9] | [2][0-4]):[0-5][0-9]/;
  9. 匹配日期例如： 我们想要匹配 “YYYY-mm-dd” 的日期格式：
    1
    let pattern = /^[0-9]{4}-([0][0-9] | [1][0-2])-(0[1-9] | [12][0-9] | [3][01])/;
  10. 匹配 innerHTML 中的类名
如果我们想要进行匹配这样一个innterHtml 中的类名： 
1
2
3
4
5
6
7
let innerHtml = '<div class="content"><div class="body"></div></div>';

pattern = /class=".*?"/i;

test = innerHtml.match(pattern)[0];
// class="content"
// 使用 ？进行的是贪婪匹配， 会      匹配尽量少的字符
  1. 对于字符串中的 trim 方法：使用正则表达式清除字符串两边的空格：
    1
    2
    3
    let str = '  hello  ';
    let regex = /^\s+|\s+$/g;
    let res = str.replace(regex, ''); // hello
  2. 验证 URL 为绝对路径
    1
    2
    3
    4
    5
    6
    7
    8
    /*
    A URL is considered absolute if it begins with "<scheme>://" or "//" (protocol-relative URL).
    RFC 3986 defines scheme name as a sequence of characters beginning with a letter and followed by any combination of letters, digits, plus, period, or hyphen.
    */
    // ? 非贪婪匹配 表明前面匹配的 () 内字符的数量可能为 0 次 匹配 // 的情况
    function isAbsoluteURL(url) {
      return /^([a-z][a-z\d\+\-\.]*:)?\/\//i.test(url);
    }