html-to-pptx-converter

使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。

下载

html规范禁止嵌套，浏览器会自动修复为多个独立导致样式和选择器失效；正则仅适用于简单单层场景，安全做法是用dom解析器递归剥离嵌套并保留语义结构。

为什么 <p></p> 里套 <p></p> 是非法且必须处理的

浏览器不会报错，但会自动“修复”：遇到 <p></p> <p>内容</p>

，解析器直接断开外层 <p></p>，变成 <p></p> <p>内容</p> <p></p>。结果是多出空段落、行高异常、CSS 选择器失效（比如 p p 永远不匹配）。这不是渲染 bug，是 HTML 规范明令禁止的嵌套——<p></p> 的「内容模型」只允许短语级内容（文本、<em></em>、<span></span> 等），不允许任何块级元素，包括它自己。

用正则批量清理嵌套 <p></p> 的安全边界在哪里

正则能快速处理单层嵌套，但无法可靠处理多层或混杂结构（如 <p></p> <div><p>…</p></div>

）。实际可用的最小安全模式是：

• 只匹配「开头无其他标签、紧贴 <p></p> 开始、且内部不含 <p></p>」的段落 —— 即 <p>[^</p> 这类简单场景
• 若需保留属性（如 <p class="intro"></p>），正则必须捕获并还原，否则会丢掉 class/style
• 绝对避免用 .*? 跨标签贪婪匹配，一碰到注释、script 或 CDATA 就崩
• 真正稳妥的做法：用 DOM 解析器（如 Python 的 BeautifulSoup、Node.js 的 jsdom、PHP 的 DOMDocument）先加载再遍历修正

用 BeautifulSoup 递归剥离多余 <p></p> 的实操要点

核心逻辑是：找到所有 <p></p>，检查其直接子节点是否包含 <p></p>；有则把内层 <p></p> 的内容提上来，再删掉内层标签。示例代码关键片段：

from bs4 import BeautifulSoup
<p>def flatten_nested_p(html):
soup = BeautifulSoup(html, 'html.parser')
for p in soup.find_all('p', recursive=True):
nested_ps = p.find_all('p', recursive=False)
if nested_ps:
for inner_p in nested_ps:</p><h1>把 inner_p 的所有子节点插入到 outer p 的末尾</h1><pre class="brush:php;toolbar:false;">            for child in inner_p.contents[:]:
                p.append(child)
            inner_p.decompose()
return str(soup)

注意点：

• recursive=False 很关键，否则会误判深层嵌套
• inner_p.contents[:] 用切片复制，避免遍历时修改导致跳过节点
• 如果 <p></p> 内还有 <div>、<code><section></section> 等块级容器，该逻辑不处理——它们本就合法，无需“扁平化”

  替换后容易被忽略的样式断裂问题

  扁平化 <p></p> 后，原来靠外层 <p></p> 控制的 margin/padding/line-height 可能消失。常见断裂点：

  • CSS 中写了 p > p { margin-top: 0; } —— 扁平后这个规则完全失效
  • 用 <p class="lead"></p> <p>正文</p> 实现首段强调，扁平后只剩一个 <p class="lead"></p>，但样式可能依赖两层结构
  • JS 里用 document.querySelectorAll('p p') 做交互，扁平后查不到节点

  真正要解决的不是“怎么删”，而是“删完谁来承接原语义”。多数情况，应该用 <div class="paragraph-group"> 或语义化容器替代外层 <code><p></p>，而不是硬塞进另一个 <p></p>。