javascript - js问下这个正则意思

问题描述

问 题

/^<([a-z][^\/\0>:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i

解决方案

[]表示匹配里面的任意一个字符，里面的-表示范围，如[a-z]表示匹配任意一个小写字母；
[^...]表示匹配除了这个里面列出来的字符的任意一个字符；
*表示匹配0到多次；
()表示捕获型括号，也就是这个里面匹配的内容可以被后续使用；
?表示0或者1次；
\1和前面的捕获型括号相关，表示引用前面第一个捕获型括号的内容，所以\2当然就表示引用第二个捕获型括号的内容；
(?:)表示非捕获性括号，因为捕获型括号的内容会被保存起来，所以耗性能，所以如果只是用括号表示优先级，那么最好使用非捕获型括号；
^匹配字符串的开始；
$匹配字符串的结束；
|表示|前面或者后面的内容取其一；
i表示匹配的时候忽略大小写；

来看上面的例子，^匹配字符串开始，然后是一个<，
然后是捕获型括号的开始内容，包括一个小写字母[a-z]，然后后面是除了空白符、>等字符之外的0到多个字符，这时匹配型括号结束，匹配的内容就是括号中的内容，
然后是0到多个空白符，然后是0个或者1个/，然后是>，
然后是一个括号的开始，然后是<，然后是一个/，然后是前面捕获的内容，然后是一个>，注意此时后面是|，所以表示这个括号的内容可以是前面说的，也可以是空字符串，然后是括号结束，然后到了字符串的结尾。

所以这个正则表达式大致匹配了不包含属性，不包含任何内容的标签，包括自关闭标签，如html中的input标签，部分测试效果见下图：

这篇关于javascript - js问下这个正则意思的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！