正则匹配包含指定内容的标签_【前端面试】JS 正则表达式

正则是处理字符串的，并进行筛选，替换。

1、最简单的匹配，正则的 helloWorld

console

2、元字符：在正则当中有特殊语义的字符

. [] [^] ? * + {min, max} ^ $ () 12 | d D w W s S

. 可以匹配除去空白字符外的所有字符

3、特殊语义的字符不可以直接匹配

console.log(/+/.test('+'))

4、匹配字符组

console.log(/[1-9]/.test('9'))
console.log(/[9-1]/.test('9'))

第一个可以正确匹配，第二个会报错

console.log(/[0-9a-zA-Z]/.test('asdf')) //匹配四次
console.log(/[0-9a-zA-Z]+/.test('asdf')) //匹配一次
[0-9a-zA-Z] 和 [a-zA-Z0-9] 是等价的

范围取反，除了 0-9 都可以

/[^0-9]/

[0-9] 等价于 d

[^0-9] 等价于 D

[0-9a-zA-Z_] 等价于 w 注意，包涵下划线

s 空白字符

5、量词

例1：邮编

100024

/[0-9]{6}/.test(code)

/d{6}/.test('1231234')

可以匹配上，但是，不知道哪里匹配，此时请使用 exec

/d{1,}.test('121314124')

意思是最少一个，最多有多少个匹配多少个。

正则有特殊语义，不要随便加空格。

等价关系：

? {0,1}
* {0,}
+{1,}

量词是修饰前面那一个字符的。

比如

/ab{2}/.exec('abb') //可以匹配
/ab{2}.exec('abab')/ //无法匹配

6、括号

() 有两个功能：分组和引用。

例2 日期

2020-9-14

/d{4}-d{1,2}-d{1,2}/.exec('2020-9-14')

假如我想把 2020 9 14 拿出来，则可以用 () 捕获

/(d{4})-(d{1,2})-(d{1,2})/.exec('2020-9-14')

插一点别的

var 

7、反向引用

/([a-z]1)/.test('bbb') //true

/(cat)(1){2,3}.test('catcatcatcat')/   //可以匹配
/(cat)(1){2,3}.test('catcatcatcatcat')/   //无法匹配

8、其他

非捕获

/(abc){2}/.exec('abcabc') // 0:abcabc 1:abc
/(?:abc){2}/.exec('abcabc'); // 0:abcabc 此时并没有捕获到 abc

匹配 200-255

/2[0-4]d|25[0-5]/

匹配 0-255

/d|[1-9]d|1dd|2[0-4]d|25[0-5]/
/^(d|[1-9]d|1dd|2[0-4]d|25[0-5]).$/.test('256.') //false

匹配年月日

月：1-12 [1-9]|1[0-2]
日：1-31 [1-9]|2d|3[01]
小时：0-24 d|1d|2[0-4]
分钟：0-59 d|5d
秒： 0-59

正向预查

正向预查指的是问号后面的字符必须出现在想匹配字符串的后面。设置的内容不参与匹配与捕获，只是设置了一个条件而已。

var reg = /cainiao(?=8)/
var str = 'cainiao9';
alert(ref.exec(str)) //无法捕获

所以，这两种写法是等价的

reg1 = /^d{2}$/
reg = /(?=^)d{2}(?=$)/

负向预查

负向预查使用 ?!，意思是字符串中一定不能包含哪些字符或者不能由哪些字符组成。

题1：匹配密码

编写一个正则，验证 6-16 位字符串，必须同时包含大小写字母和数字

/(?!^[0-9a-z]+$)(?!^[0-9A-Z]+$)(?!^[a-zA-Z]+$)^[0-9a-zA-Z]{6,16}?/

题2：匹配指定字符串

编写正则，1-10位字符串，数字，字母，下滑线，必须有_

/(?!^[a-zA-Z0-9]+$)^[a-zA-Z0-9_]{1,10}$/

题3：匹配 url

let str="http://www.mike.cn/?lx=100&from=wx#video"

• 协议: http/https/ftp

(http|https|ftp://)?

• 域名: www.xxx.xx 或 xxx.xx 或 kbs.sport.qq.com 或 kbs.sports.qq.com.cn

(([w-]+.)+[0-9a-z]+)

• 请求路径 index.html 或 stu/index.html 或 /stu/ 或 /

((/[^/]*)+)?
[^/]的意思是不是/的字符都可以

• 问号传参 ?xxx=xxx&xxx=xxx&xxx=xxx

(?[^#]+)?

• 哈希值 #xxxx

(#.+)?

把这五部分拼接起来即可

let 

/i 忽略大小写匹配

题4：匹配标签

<h1></h1>

let reg = /<([^<>]+)>([./s]*)?</(1)>/

看懂上面这个正则有两点，一个是把 h1 捕获用在第二个标签上，第二个是标签里面的内容只要不是 <> 就都可以。