正则表达式不能真正格式化HTML，但可高效修复局部结构问题；因其不支持递归，无法可靠处理嵌套、自闭合标签或未闭合标签，应配合HTML解析器使用。
正则表达式不能真正格式化 HTML，但能快速修复常见结构问题
HTML 是嵌套结构，而正则表达式不支持递归匹配，所以用 re.sub 或 VS Code 的查找替换「美化」整个文档，大概率会破坏语义、错配标签或漏掉自闭合元素。但它对局部清理非常高效——比如补全缺失的引号、统一属性空格、修正换行混乱的内联标签。
修复属性值未加引号（尤其 class 和 id）
很多手写或生成的 HTML 会写成 <div class=header>，这在某些浏览器下虽能解析，但不符合标准，也影响后续解析器（如 BeautifulSoup）的稳定性。
可用正则批量补双引号：
find: (\s+)([a-zA-Z0-9\-]+)=([a-zA-Z0-9\-\.\/]+)(?=\s|>) replace: $1$2="$3"
注意点：
立即学习“前端免费学习笔记（深入）”；
- 这个模式只匹配「无引号且值不含空格/特殊字符」的情况，不会误伤
href="https://example.com?a=b&c=d" -
class=foo-bar→class="foo-bar"，但class=header main不会动（它本就该加引号） - 实际使用前建议先
Ctrl+F预览匹配项，避免覆盖ng-if="item.id === 1"这类模板语法
把单行混乱的标签块转为可读缩进（适用于简单组件）
例如把 <div><p>Hello</p><span>World</span></div> 拆成多行并缩进。这不是完整格式化，但能让调试更轻松。
推荐分两步做（VS Code 或 Sublime Text 中）：
- 第一步：用
<(/?[a-zA-Z][^>]*)>匹配所有标签，替换为\n<$1>\n（前后加换行） - 第二步：选中全部 →
Shift+Alt+F（触发 Prettier）或手动缩进；若没装插件，可用查找\n\n<替换为\n<去掉多余空行 - ⚠️ 不要对含
<script>或<style>的文件直接套用，JS/CSS 内容里的<会被误识别
为什么别用正则「自动闭合未闭合标签」
这是最常被问、也最危险的操作。你可能会搜到类似 <div[^>]*>(?!(?:.*</div>)) 这样的模式，但它根本不可靠：
- 无法区分
<div id="outer"><div id="inner">content</div>中哪个<div>缺闭合 - 遇到
<img src="x">、<br>等自闭合标签时逻辑全乱 - 一旦 HTML 含注释
<!-- <div> -->或 CDATA，正则基本失效
真要补全标签，请用专门工具：tidy -w 0 -i -m file.html（HTML Tidy），或 Python 的 BeautifulSoup(file, 'html.parser').prettify() —— 它们基于真实解析树，不是字符串猜测。
正则在 HTML 上的价值，从来不是替代解析器，而是帮你把「已经能跑但看着难受」的代码，快速推到「能看懂、好调试」那一步。越想让它干 Parsing 的活，越容易在某次上线前发现页面崩了。
