Defuddle

在信息过载的今天，从杂乱的网页中提取纯净的核心内容是一项高频需求。无论是为了阅读、归档还是作为 AI 的输入素材，我们都需要一个能精准剥离广告、侧边栏和导航栏的工具。Defuddle 是一款专为提取网页主要内容而设计的开源工具，它能将任意 URL 或 HTML 转化为干净的 Markdown 或 HTML，尤其适合需要高质量文本数据的场景。

Defuddle 最初是为浏览器扩展 Obsidian Web Clipper 打造的引擎，但因其出色的表现，现已独立成为一个通用的解决方案。它常被视为 Mozilla Readability 的强力替代品，但在处理复杂页面结构时表现得更加智能和宽容。

核心优势：比 Readability 更懂“内容”

与传统的提取工具相比，Defuddle 在以下几个关键维度上进行了优化：

• 更宽容的过滤策略：它不会激进地移除所有“不确定”的元素，从而降低了误删重要内容（如复杂的图表说明、嵌入式代码）的风险。
• 结构化输出增强：针对脚注、数学公式（MathJax/KaTeX）、代码块等特殊元素，Defuddle 能提供标准化的输出格式，确保转换后的 Markdown 依然保持完美的排版。
• 利用移动端样式：它能智能识别页面的移动端适配样式，以此作为判断哪些元素是“非必要装饰”的重要依据，提高提取准确率。
• 丰富的元数据提取：除了正文，它还能深度挖掘 schema.org 数据，提取作者、发布日期、摘要、封面图等关键元信息。

多场景使用指南

Defuddle 提供了极其灵活的使用方式，覆盖浏览器、Node.js 后端及命令行终端。

1. 浏览器端集成

直接在浏览器环境中运行，无需额外依赖。

import Defuddle from 'defuddle';

const defuddle = new Defuddle(document);
const result = defuddle.parse();

console.log(result.title);   // 文章标题
console.log(result.content); // 干净的 HTML 内容
console.log(result.author);  // 作者

2. Node.js 后端处理

支持多种 DOM 实现（如 linkedom, jsdom, happy-dom），并可一键转换为 Markdown。

import { parseHTML } from 'linkedom';
import { Defuddle } from 'defuddle/node';

const { document } = parseHTML(htmlString);
const result = await Defuddle(document, 'https://example.com/article', {
  markdown: true // 直接输出 Markdown
});

console.log(result.content); 

3. 命令行工具 (CLI)

无需编写代码，直接在终端快速提取内容，支持管道操作和文件输出。

# 提取 URL 内容并转为 Markdown
npx defuddle parse https://example.com/article --markdown

# 提取本地 HTML 文件并输出为 JSON（含元数据）
npx defuddle parse page.html --json

# 仅提取标题
npx defuddle parse page.html --property title

# 保存结果到文件
npx defuddle parse page.html --output result.md

强大的标准化能力

Defuddle 不仅仅是“删除”噪音，它还会对保留的内容进行“清洗”和“标准化”，使其更适合后续处理：

• 标题层级优化：自动移除与文章标题重复的 H1/H2，并将剩余标题层级理顺（如 H1 转 H2），去除锚点链接。
• 代码块净化：移除行号和内联高亮样式，保留语言标识（data-lang），确保代码块在 Markdown 中正确渲染。
• 数学公式转换：将 MathJax 或 KaTeX 的私有格式统一转换为标准的 MathML，兼容性强。
• 标注/Callout 支持：智能识别 GitHub Alerts、Obsidian Callouts、Bootstrap Alerts 等多种警示框格式，并统一转换为 Obsidian 风格的 Markdown 标注（> [!info]）。
• 脚注规范化：将各种形式的内联引用和底部脚注转换为标准的 HTML 脚注结构，支持双向跳转。

灵活的配置选项

用户可以通过丰富的参数微调提取行为，例如：

• removeHiddenElements: 移除 CSS 隐藏元素。
• removeSmallImages: 过滤掉图标和追踪像素等小图。
• includeReplies: 控制是否提取评论区回复（支持针对特定站点优化）。
• language: 指定首选语言，优化多语言页面的提取效果。