常用正则表达式汇总整理——HTML篇

yumo66610个月前 (04-27)技术文章132

1、匹配HTML开始标签及结束标签

这段正则,为什么比网上搜索的复杂一些呢?主要是加了匹配特测情况的问题,避免BUG。

举例:<div debug=">" ></div>

const reg_tags = /<((["'])+.*?\2|[^>])+>/g;

2、匹配HTML开始标签

const reg_tag_start = /<[^\\\/]((["'])+.*?\2|[^>])+>/

3、匹配HTML结束标签

const reg_tag_end = /<[\\\/]+[^<>]*>*/


4、匹配HTML标签属性

const reg_tag_attrs = /(?<=\s)[\w:-]+(=(["']).*?\2)*/g;

5、获取HTML标签属性名与值

const reg_tag_attr_info = /(^[^=]+|(?<=(['"])).*?(?=\2))/g;

6、获取HTML标签的名称

const reg_tag_name = /(?<=<[\/\s]*)\w+(?=(\s+(?![\s=])|>))/;

7、匹配HTML文档类型声明

const reg_doctype = /<!doctype[^<>]*>*/i

8、匹配HTML文档注释

const reg_tag_note = /<\!.*?>/

9、匹配HTML文本内容

const reg_text = /(?<=<[\w]+.*?>)[\s\S]*?(?=</[\w]*?>)/


10、其它

//g 正则表达式后面加g,表示全局匹配。

//i 正则表达式后面加i,表示不区分大小写。

[\u4e00-\u9fa5],表示匹配中文。

[^\x00-\xff\u4e00-\u9fa5],表示匹配中文符号


以上正则表达式,是在写一个生成HTML抽象语法树的工具时,不断摸索出来。如果您有更好的写法,欢迎交流。


人人为我,我为人人,欢迎您的浏览,我们一起加油吧。

相关文章

什么是HTML

1 什么是HTMLHTML 是用来描述网页的一种语言。HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本,添加图片,创建链接、输入表单、框架和表格等等,并可将之存为文本文件,...

HTML元素基础讲解

HTML元素的基本结构HTML元素通常由开始标签、内容和结束标签组成。基本结构如下:<标签名>内容</标签名>例如,一个段落元素:<p>这是一个段落。</p&...

html表单元素-html教程

html表单元素-html教程表单元素文本类:123456表单元素-按钮类:复选框与单选框:你的爱好是:吃饭睡觉打豆豆你的性别是:男女文件选择:下拉列表与下拉框:div+css,html学习,html...

什么是html?

什么是html?在网站中我们会遇见很多的代码,html代码,JavaScript,php,css,那它们到底是什么呢?HTML负责放你需要显示的内容,PHP可以输出可变化的HTML。CSS可以让你的H...

「前端」HTML之结构

今天继续为大家分享前端的知识,如果对前端比较感兴趣的小伙伴,可以关注我,我会更大家继续分享更多与前端相关的内容,当然如果内容中又不当的或者文字错误的,欢迎大家在评论区留言,我会及时修改纠正。1.初识H...

你知道HTML、CSS、JS文件在浏览器中是如何转化成页面的吗?

在前面一篇文章:「高频面试题」浏览器从输入url到页面展示中间发生了什么 中,我们有对浏览器的渲染流程做了一个概括性的介绍,今天这篇文章我们将深入学习这部分内容。对于很多前端开发来说,平常做工主要专注...