HTML转Markdown转换器 - HTML与Markdown互相转换 在线工具
支持GFM表格、任务列表和删除线的HTML与Markdown格式双向转换。100%客户端处理，您的数据永远不会离开浏览器。
常见问题
什么是HTML转Markdown转换器？
HTML转Markdown转换器是一种将HTML标记（用于构建网页的基于标签的语言）转换为Markdown语法（一种轻量级、人类可读的格式化语言）的工具。例如，<code><h1>标题</h1></code>变为<code># 标题</code>，<code><strong>粗体</strong></code>变为<code>**粗体**</code>。在将内容从基于HTML的CMS（WordPress、Drupal）迁移到基于Markdown的系统（Hugo、Jekyll、Gatsby）、清理网页抓取的内容或将HTML文档转换为GitHub仓库的Markdown文件时非常有用。
如何使用这个HTML转Markdown转换器？
1. 选择转换方向：<strong>HTML转Markdown</strong>或<strong>Markdown转HTML</strong>。2. 在输入区域粘贴内容，或点击<strong>Sample</strong>按钮加载示例内容，或点击<strong>Upload</strong>按钮上传文件。3. 输入时自动实时转换。4. 对于HTML转Markdown，可以调整格式选项（标题样式、列表符号、代码块样式）。5. 在输出区域查看转换结果。6. 点击<strong>Copy</strong>按钮复制到剪贴板，或<strong>Download</strong>保存为文件。7. 使用<strong>Swap</strong>按钮快速反转转换方向。
我的数据安全吗？会发送到服务器吗？
您的数据100%安全，永远不会离开您的浏览器。此转换器使用Turndown库（用于HTML转Markdown）和Marked库（用于Markdown转HTML），两者都完全在客户端JavaScript中运行。不会将数据传输到任何服务器、存储在任何数据库中或记录在任何地方。所有解析和转换都在您的设备上本地进行。您可以通过断开互联网连接来验证——初始页面加载后，该工具完全离线工作。
转换为Markdown时支持哪些HTML元素？
此转换器支持所有具有Markdown等效项的标准HTML元素：标题（h1-h6）、段落（p）、粗体（strong/b）、斜体（em/i）、删除线（del/s）、链接（a）、图片（img）、有序/无序列表（ol/ul/li）、块引用（blockquote）、代码块（pre/code）、内联代码（code）、水平线（hr）和表格（table）。还支持GitHub Flavored Markdown扩展，包括表格、任务列表和删除线。
转换为HTML时支持哪些Markdown语法？
Markdown转HTML方向支持完整的CommonMark规范和GitHub Flavored Markdown（GFM）扩展。包括：标题（ATX #和Setext下划线）、强调和加粗（*和**）、链接（内联和引用）、图片、带语言提示的围栏代码块、块引用、有序/无序列表（包括嵌套）、水平线、GFM表格、任务列表、删除线和自动链接URL。
可以自定义Markdown输出格式吗？
是的，在将HTML转换为Markdown时，您可以配置多种输出格式选项：<strong>标题样式</strong>（使用#符号的ATX或使用下划线的Setext）、<strong>列表符号</strong>（短横线-、星号*或加号+）和<strong>代码块样式</strong>（反引号围栏或4空格缩进）。所有选项都同步到URL，因此您可以分享包含首选设置的链接。
转换过程中HTML中的CSS样式和JavaScript会怎样？
CSS样式（内联style属性和类名）、JavaScript代码（script标签和事件处理程序）以及其他非内容元素在转换过程中会被删除。转换器仅专注于内容级别的转换——它从HTML中提取语义结构和文本内容，而非视觉样式。这是设计使然，因为Markdown是一种不支持样式的内容格式。如果需要保留特定格式，可以考虑在Markdown中使用内联HTML。
代码示例
// HTML to Markdown conversion using Turndown library
// Install: npm install turndown turndown-plugin-gfm
const TurndownService = require('turndown');
const { gfm } = require('turndown-plugin-gfm');
function htmlToMarkdown(html, options = {}) {
const {
headingStyle = 'atx',
bulletListMarker = '-',
codeBlockStyle = 'fenced',
} = options;
try {
const turndownService = new TurndownService({
headingStyle,
bulletListMarker,
codeBlockStyle,
hr: '---',
fence: '```',
emDelimiter: '_',
strongDelimiter: '**',
linkStyle: 'inlined',
});
turndownService.use(gfm);
const markdown = turndownService.turndown(html);
return { success: true, output: markdown };
} catch (error) {
return { success: false, error: error.message };
}
}
// Markdown to HTML using marked
// Install: npm install marked
const { marked } = require('marked');
function markdownToHtml(markdown) {
try {
const html = marked.parse(markdown, { gfm: true });
return { success: true, output: html };
} catch (error) {
return { success: false, error: error.message };
}
}
// Example usage
const html = '<h1>Hello</h1><p>This is <strong>bold</strong></p>';
const result = htmlToMarkdown(html);
console.log(result.output);
// Output: # Hello\n\nThis is **bold**