正则删 style 属性大概率翻车，因会误删 标签、CDATA 块、注释中的字符串，破坏 HTML 结构，导致页面样式全崩。
直接删掉所有 style 属性是可行的，但不能靠正则全局替换 style=".*?" —— 它会误杀 <style></style> 标签、CDTA 块、注释里的字符串，甚至破坏 HTML 结构。
为什么正则删 style 属性大概率翻车
很多脚本用 /style\s*=\s*["'].*?["']/gi 匹配并删除，看似简洁，实际踩坑密集：
- 遇到
<style type="text/css">...</style>会被整段干掉，页面样式全崩 - HTML 注释里有
<!-- <div style="..."> -->？正则会把注释提前截断，导致后续解析失败 - 属性值含换行或转义引号（如
style="width: 100%; color: red;"）时，.*?不匹配跨行，漏删 - 某些 CMS 输出带
data-style或v-style自定义属性，也被误伤
真正安全的批量清理路径：用 DOM 解析器而非字符串处理
必须把 HTML 当作结构来操作，不是文本。推荐两个轻量方案：
htmlppt.skill
下载
把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。
- Node.js 环境下用
cheerio（比jsdom内存友好）：const $ = cheerio.load(html, { xmlMode: false });<br>$('[style]').removeAttr('style');<br>return $.html(); - 浏览器环境用原生 DOM：
const parser = new DOMParser();<br>const doc = parser.parseFromString(html, 'text/html');<br>doc.querySelectorAll('[style]').forEach(el => el.removeAttribute('style'));<br>return new XMLSerializer().serializeToString(doc); - 若需保留部分内联样式（如
transform、display），改用el.style.cssText = el.style.cssText.replace(/(width|height|padding|margin|font-size|color)/gi, '')，再清理空余分号
CMS 导出内容中隐藏的 style 来源要一并扫清
光删 style 属性不够，这些地方也常埋雷：
立即学习“前端免费学习笔记（深入）”；
-
<font></font>标签：WangEditor、老版 WordPress 富文本仍输出它，需转为span+ class 或直接移除 - 内联
<style></style>块：有些插件在文章末尾塞一段<style>.wp-block-pullquote{...}</style>，得单独提取并合并到外部 CSS - JS 动态写的
element.style.xxx = '...'：这类无法从静态 HTML 清理，只能在渲染后用 MutationObserver 拦截并重置 - 第三方嵌入代码（如广告、统计脚本）自带的
style属性：建议白名单过滤，别一刀切
最易被忽略的是：清理完 style 后，表格边框、文字颜色、图片尺寸可能全乱——因为 CMS 默认依赖这些内联值做视觉兜底。必须补上基础重置规则，比如 table, td, th { border: none; padding: 0; margin: 0; }，否则“干净了”但“不能看了”。
