html怎么显示的是火星文,看懂火星文(一)

感谢

本文参考《正则表达式迷你书》

模糊匹配

横向模糊匹配

什么是横向模糊匹配?

正则可匹配的字符串的长度不是固定的。例如/ab{2, 5}c/, 含义一个a接下来2到5个b接下来是c。

纵向模糊匹配

什么是纵向模糊匹配?

正则匹配到字符串到某一个的字符时，可以不是某个确定的字符，可以有多种可能。例如/a[123]b/, 匹配的字符串可以是a1b, a2b, a3b

字符串组

虽叫字符组, 但是正则只是匹配字符组中的一个字符

范围表示法

[123456abcGHIJ]

// 可以写成

[1-6a-cG-J]

排除字符组

// 就是字符串中某一位不能为abc

[^abc]

常见的简写形式

简写

原始

d

[0-9]

D

w

[0-9a-zA-Z]

W

s

[tvnrf] 空白, 水平制表, 垂直制表, 换行, 回车, 换页

S

.

通配符

如何匹配任意字符 ？

[dD], [wW], [sS], [^]

量词

量词简写

量词

含义

{m, }

至少出现m次

{m}

出现m次

?

{0, 1}

| {1, }

| {0, }

贪婪匹配和惰性匹配

什么是贪婪匹配

是尽可能多的匹配

// reg会尽可能多的匹配, 例如: 12345, 我会匹配12345而不匹配12

var reg = /\d{2, 5}/g;

什么是惰性匹配

是尽可能少的匹配

// reg会尽可能少的匹配, 例如: 12345, 我会匹配 12, 34

// 只要满足2个, 就不会往下匹配了

var reg = /\d{2, 5}?/g

贪婪量词, 惰性量词

惰性量词一般是在贪婪量词后面添加问号

贪婪量词

惰性量词

{m, n}

{m, n}?

{m, }

{m, }?

?

??

| +?

| *?

多选分支

什么是多选分支

多选分支可以支持多个子正则任选其一。注意分支匹配也是惰性的, 当匹配满足第一个后就不会第二个了。

// 可以匹配good或者nice

var reg = /good|nice/

案例

匹配16禁止颜色值

分析

以“#”开头, #字后面可能出现[0-9a-fA-F]的字符, 3次或者6次

实现

var reg = /^#{1}[0-9a-fA-F]{3}$|^#{1}[0-9a-fA-F]{6}$/g

匹配时间

分析

当时间的第一位以0或者1开头的时候, 第二位可以是0到9数字

当时间的第一位以2开头的时候, 第二位只能是0-3的数字

实现

// 匹配补0的时间格式(MM:SS)

var reg1 = /^([01][0-9]|[2][0-3]):[0-5][0-9]$/g

// 匹配不需要补0的时间格式(M:S|MM:SS), 个位数开始0可以不写

var reg2 = /^(0?[0-9]|[1][0-9]|[2][0-3]):(0?[0-9]|[1-5][0-9])$/g

📅 匹配日期

分析

匹配年份的时候, 年份由0到9的数字组成的4位数组成

匹配月份的时候, 月份以0作为第一位数字的时候第二位可以是1到9的任意数字, 月份以1作为第一位数字的时候第二位可以是1到2的任意数字

匹配日期的时候, 日期最大31天

实现

var reg = /^([0-9]{4})-(0[1-9]|1[1-2])-(0[1-9]|[12][0-9]|3[01])$/g

📃 匹配window的文件路径

路径的常见格式如下:

F:studyjavascriptregexregular expression.pdf

F:studyjavascriptregex\

F:studyjavascript

分析

首先匹配判符F:, 可以使用正则[a-zA-Z]:\

实现排除字符组

文件名不能为空字符串

文件的路径可以很长所以添加量词, (

文件的路径不以""结尾, 所以我们添加一个匹配路径结尾的正则 (

实现

var reg = /^[a-zA-Z]:\\([^\\:*<>|"?\r\n/]+\\)*([^\\:*<>|"?\r\n/]+)?$/g

💻 匹配HTML中id属性

分析

var reg = /id=".*"/

如果使用此正则, 由于是贪婪的, 并且.是通配符包含了", 所以会匹配到最后一个"之前的所用内容(包括其他的")。我们可以使用惰性匹配模式(在量词后面添加问号)

实现

// .*后遇到第一个"就会停止匹配

var reg1 = /id=".*?"/g

0-9 ↩

0-9a-zA-Z ↩

tvnrf ↩

\:*<>|"?rn/ ↩

\:*<>|"?rn/ ↩

\:*<>|"?rn/ ↩

\:*<>|"?rn/ ↩