空值、冗余语义及过时HTML属性可安全批量删除，如aria-label=""、role="presentation"加在span/p上、border/cellpadding等表格旧属性、type="text/javascript"；事件和状态依赖属性（如aria-live、onclick）须人工确认，否则破坏可访问性与交互。
HTML 多余属性不能靠“看着删”，必须按属性类型分策略处理——空值/冗余语义类可批量删，事件/状态依赖类必须人工确认，否则读屏器或键盘导航会直接失效。
哪些属性能安全批量删？看三类典型模式
判断依据不是“有没有用”，而是“删了是否影响可访问性链路和运行时行为”：
-
aria-label=""、aria-hidden="true"加在无内容、不可聚焦的div上 → 可删 -
role="presentation"或role="none"出现在span、p等原生无交互标签上 → 可删 -
border、cellpadding、cellspacing、align、valign（非表格数据场景）→ 现代 CSS 已接管，可删 -
language、type="text/javascript"（script标签）→ 默认值，可删 -
tabindex="-1"和aria-hidden="true"同时存在 → 二者目标冲突，通常只留一个
VSCode 正则怎么写才不误伤？重点防跨标签和干扰项
正则不是万能钥匙，错一个字符就可能吃掉整个标签。关键在边界控制和非贪婪限定：
- 删空值 aria 属性：
aria-[a-z-]*=["']\s*["']—— 匹配双引号/单引号+纯空白，不跨标签 - 删
table过时属性：(border|cellpadding|cellspacing)="[^"]*?"——[^"]*?防止吃到下一个引号 - 删
id属性：\sid\s*=\s*["'][^"']*?["']—— 开头加\s确保是独立属性，避开data-id - 禁用
.*全局匹配：它会把<div id="a"><p class="b"></p></div>中的id="a"><p> 一起吞掉</p><div class="aritcle_card flexRow"> <div class="artcardd flexRow"> <a class="aritcle_card_img" href="/xiazai/skill11445" title="使用华数设计生成高保真HTML原型、演示文稿、动画和设计评审"><img src="https://img.php.cn/upload/skill/001/246/273/6adaf20e695c2374.jpg" alt="使用华数设计生成高保真HTML原型、演示文稿、动画和设计评审" ></a> <div class="aritcle_card_info flexColumn"> <a href="/xiazai/skill11445" title="使用华数设计生成高保真HTML原型、演示文稿、动画和设计评审">使用华数设计生成高保真HTML原型、演示文稿、动画和设计评审</a> <p>使用经过文档化的设计技能，从真实的品牌或项目背景中生成HTML原生原型、幻灯片、动态演示、可视化图表和评审流程。</p> </div> <a href="/xiazai/skill11445" title="使用华数设计生成高保真HTML原型、演示文稿、动画和设计评审" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div>
为什么不能用 innerHTML.replace() 清事件或 style？
看似一行代码搞定，实则埋下三重隐患：
立即学习“前端免费学习笔记（深入）”；
- 执行
el.innerHTML = el.innerHTML.replace(...)会强制重建子树 → 所有addEventListener绑定丢失 - 正则匹配
on\w+=会误杀data-on-click或注释里的伪代码 - 处理
style时，若值含换行或转义引号（如style="width: 100%;\nheight: auto;"），普通正则直接失灵 - 真正安全的做法是用
DOMParser解析字符串，再遍历querySelectorAll('*[style]')调用removeAttribute('style')
删完必须验证的三个盲区
页面看起来“没变”不等于可访问性没崩。以下三点最容易被跳过：
- 进 Chrome DevTools 的 Accessibility 面板，右键关键控件 →「Reveal in Accessibility Tree」，确认
aria-labelledby删除后输入框是否还能被正确朗读 - 用键盘 Tab 流走一遍：删了
aria-live，表单成功提示是否彻底不播报？删了role="dialog"，模态框是否还在辅助树里被识别为对话框？ - 全局搜索
getElementById、querySelector('#、$('，确认 JS 中没有硬编码依赖刚删掉的id值
