正则表达式示例集合

目录：

• • 1、精准匹配
  • 2、字符匹配
  • 3、参考示例
  • • 3.1、一个合理的用户名正则表达式
    • [3.2、匹配 HTML 标签及内容](#3.2、匹配 HTML 标签及内容)
    • 3.3、其他示例
    • 3.4、微信号正则表达式
    • 3.5、QQ号正则表达式
    • 3.6、车牌号号正则表达式
    • 3.7、邮箱正则表达式

1、精准匹配

单字符模式，如 a，不论出现在搜索字符串中的何处，它总是匹配字母 a，下面是一些单字符正则表达式模式的示例：

/a/
/b/
/c/

正则表达式将精确匹配字符串 "abc"，无论该字符串出现在文本中的哪个位置，只有当它与 "abc" 完全匹配时才会成功

/abc/

2、字符匹配

通配符 ：

点号 . 匹配任意单个字符，除了换行符 \n 和 \r。下面的正则表达式匹配 aac、abc、acc、adc 等等，以及 a1c、a2c、a-c 和 a#c：

/a.c/

若要匹配包含文件名的字符串，而句点 . 是输入字符串的组成部分，请在正则表达式中的句点前面加反斜杠 \ 字符。举例来说明，下面的正则表达式匹配 filename.ext：

/filename\.ext/

量词：*

匹配前面的元素零次或多次：

/a*b/

这个表达式可以匹配 "b"、"ab"、"aab"、"aaab" 等字符串。

量词 +

匹配前面的元素一次或多次：

/a+b/

这个表达式可以匹配 "ab"、"aab"、"aaab" 等字符串，但不匹配 "b"。

量词 ?

匹配前面的元素零次或一次：

/colou?r/

这个表达式可以匹配 "color" 或 "colour"。

3、参考示例

3.1、一个合理的用户名正则表达式

var str = "abc123-_def";
var patt = /[a-zA-Z0-9_-]+/;
document.write(str.match(patt));

3.2、匹配 HTML 标签及内容

以下正则表达式用于匹配 iframe 标签：

/<iframe(([\s\S])*?)<\/iframe>/

其他标签的匹配可以替换 iframe 。

匹配 id="mydiv" 的 div 标签：

/<div id="mydiv"(([\s\S])*?)<\/div>/

匹配所有 img 标签：

/<img.*?src="(.*?)".*?\/?>/gi

3.3、其他示例

3.4、微信号正则表达式

//微信号正则，6至20位，以字母开头，字母，数字，减号，下划线
var wxPattern = /^[a-zA-Z][-_a-zA-Z0-9]{5,19}$/;
//输出 true
document.write(wxPattern.test("runoob123"));

3.5、QQ号正则表达式

//QQ号正则，5至11位
var qqPattern = /^[1-9][0-9]{4,10}$/;
//输出 true
document.write(qqPattern.test("65974040"));

3.6、车牌号号正则表达式

//车牌号正则
var cPattern = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/;
//输出 true
document.write(cPattern.test("京K39006"));

3.7、邮箱正则表达式

const validateEmail = (email) => {
  return email.match(
    /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
  );
};

const validate = () => {
  const $result = $('#result');
  const email = $('#email').val();
  $result.text('');

  if (validateEmail(email)) {
    $result.text(email + ' 是一个正确的邮箱地址 :)');
    $result.css('color', 'green');
  } else {
    $result.text(email + ' 不是一个邮箱地址 :(');
    $result.css('color', 'red');
  }
  return false;
}

$('#email').on('input', validate);