Markdown 转 HTML 在线工具：marked.js、markdown-it、Pandoc 对比

Q: 支持 GFM 吗（表格、任务列表、代码块）？

支持。按 GFM 规范转换，| col1 | col2 | 管道表格、- [x] 任务列表复选框、~~删除线~~、带语言提示的围栏代码块都会正确转成标准 HTML 元素。

用 Markdown 写好的文章想发到只认 HTML 的博客平台，要把正文塞进 HTML 邮件模板，或者公司内网 CMS 的富文本编辑器只接受 HTML 粘贴。这些场景最后都落到同一步：把 Markdown 转成 HTML。

本地装 Pandoc 或写构建脚本都能做，但每次都要敲命令很麻烦；把内部文档贴到第三方在线服务又不放心。这篇文章先理清 Markdown 和 HTML 的关系，再给出浏览器里直接完成转换的方法，最后对比常用库和 CLI 工具的适用场景。

结论先行

把 Markdown 粘贴到 Markdown 转 HTML 在线工具，点「运行」按钮，立刻就能复制 HTML 代码。无需安装软件，转换全程在浏览器内完成，数据不会发送到外部服务器。

输出语法以 CommonMark在新标签页中打开为基准，表格、任务列表、删除线、自动链接等扩展遵循 GitHub Flavored Markdown (GFM) 规范在新标签页中打开。两者的差异详见CommonMark 和 GFM 的区别。

Markdown 和 HTML 的关系

Markdown 是一种轻量级标记语言，目标是让人类读写都方便。HTML 是浏览器渲染页面的结构化语言，用标签包裹每个元素。比如这段 Markdown：

# 标题

这是一个包含 **加粗** 和 _斜体_ 的段落。

- 列表项 1
- 列表项 2

转成 HTML 后是：

<h1>标题</h1>
<p>这是一个包含 <strong>加粗</strong> 和 <em>斜体</em> 的段落。</p>
<ul>
  <li>列表项 1</li>
  <li>列表项 2</li>
</ul>

Markdown 在设计时就以输出 HTML 为前提，两者的语法和标签基本是一一对应的。

什么场景需要把 Markdown 转成 HTML

只接受 HTML 的博客和 CMS

WordPress 的经典编辑器、不少企业内网 CMS 的富文本编辑器都只认 HTML。先用 Markdown 写好草稿，转成 HTML 再粘贴进去，版式和排版就能完整带过去。

HTML 邮件正文

做 EDM 营销邮件或 newsletter 时，正文最终要交给邮件模板。用 Markdown 起稿可读性好，写完后转成 HTML 填进模板，格式干净统一。

静态站点和文档构建流水线

有些静态站点生成器或内部文档工具不直接解析 Markdown，构建阶段只吃渲染好的 HTML 文件。这时需要在流水线上加一步 Markdown 转 HTML 的处理。

在 FormatArc 里把 Markdown 转成 HTML

操作很简单：粘贴、点按钮、出结果。

步骤 1：打开工具

访问 Markdown 转 HTML 在线工具。

步骤 2：粘贴 Markdown

在左侧编辑器里粘贴要转换的 Markdown 文本。标题、列表、链接、图片、代码块等常用语法都支持。

步骤 3：点击运行

点「运行」按钮，右侧立刻输出转换后的 HTML 代码。

FormatArc Markdown 转 HTML 转换结果

支持 GFM 规范，| col1 | col2 | 格式的管道表格、- [x] 形式的任务列表复选框都会正确转成对应的 HTML 标签。

所有计算都跑在浏览器里。未发布的草稿或内部文档贴进去，数据也不会外泄。

支持的 Markdown 语法

常用 GFM 语法都支持：

标题（# 到 ######）
段落和换行
强调（**加粗**、_斜体_、~~删除线~~）
有序列表和无序列表
任务列表（- [ ]、- [x]）
链接和图片
行内代码和围栏代码块
表格
引用（>）
分隔线（---）

数学公式（KaTeX / MathJax）不支持。

写 Markdown 表格时注意：表头行和分隔行的列数必须一致，否则不会正常转成 HTML 的 <table> 元素。列对齐用冒号标记（:--- 左对齐、:---: 居中、---: 右对齐），分隔行写几列就输出几列。表格语法的完整参考见 Markdown 表格语法。

用 JavaScript 库或 CLI 做 Markdown 转 HTML

单次转换用浏览器工具就够了。如果要接入 CI/CD 构建、自建静态站点生成器，或者在应用内渲染 Markdown，用 JavaScript 库或 CLI 更合适。

marked.js（浏览器和 Node 都能跑）

轻量快速的 Markdown 解析器，浏览器和 Node.js 环境都能运行。npm install marked 安装后一行代码就能转换：

import { marked } from 'marked';

const html = marked.parse('# 标题\n\n这是一个 **加粗** 段落。');

GFM 默认开启，任务列表、管道表格、围栏代码块不用额外配置就按规范转换。

不想搭构建环境的话，可以从 CDN 引入，直接在网页里转换。只要处理的是用户输入这类不可信内容，就必须配合 DOMPurify 等净化库使用：

<script type="module">
  import { marked } from 'https://cdn.jsdelivr.net/npm/marked/lib/marked.esm.js';
  document.body.innerHTML = marked.parse('# 在浏览器里直接转换');
</script>

markdown-it（扩展性优先）

基于插件架构的解析器。需要脚注、自定义容器块、站点特有语法扩展的项目适合用它。

import MarkdownIt from 'markdown-it';

const md = new MarkdownIt({ html: true, linkify: true });
const html = md.render('# 标题\n\n这是一个 **加粗** 段落。');

表格和任务列表默认是关闭的，需要 GFM 行为的话要另外加 markdown-it-task-lists 之类的插件。

remark（unified 流水线）

marked 和 markdown-it 是一次性把 Markdown 字符串变成 HTML 字符串，remark在新标签页中打开则先把 Markdown 解析成语法树（AST），再用插件逐步加工，最后序列化成 HTML。

remark-gfm 开启表格和任务列表，remark-rehype 把语法树切到 HTML 树，中间可以夹 rehype-sanitize 等加工步骤，最后用 rehype-stringify 输出：

import { remark } from 'remark';
import remarkGfm from 'remark-gfm';
import remarkRehype from 'remark-rehype';
import rehypeSanitize from 'rehype-sanitize';
import rehypeStringify from 'rehype-stringify';

const html = await remark()
  .use(remarkGfm)
  .use(remarkRehype)
  .use(rehypeSanitize)
  .use(rehypeStringify)
  .process('# 标题\n\n这是一个 **加粗** 段落。');

比一行 marked.parse() 复杂，但这正是流水线的取舍：净化、给标题加锚点、自动生成目录这类多段加工场景下更合适。FormatArc 自己也这样分工：粘贴文本的快速转换走 marked，博客页面渲染走 remark + rehype 流水线（GFM、净化、目录用的标题 slug）。

Python 库

Python 脚本或数据管道里批量把 Markdown 文件转成 HTML 文件，markdown 库是常用选择：

pip install markdown

import markdown

html = markdown.markdown("# 标题\n\n这是一个 **加粗** 段落。", extensions=["tables"])
print(html)

tables 扩展开启管道表格支持。适合写脚本批量处理文档目录，或者在 Airflow 等调度框架里作为转换步骤。

Pandoc（CLI）

通用文档转换 CLI。批量文件转换、构建流水线、以及 Markdown/HTML 之外还要出 PDF 或 Word (DOCX) 的场景，它是主力。

pandoc -f markdown -t html input.md -o output.html

用选项标志可以在 CommonMark、GFM、MultiMarkdown 等解析器之间切换。格式覆盖广度和输出灵活性在 CLI 工具里没有对手。

默认输出是 HTML 片段（不带 <html> 和 <head> 标签）。Pandoc 手册在新标签页中打开里常用的标志摘录如下：

标志	作用
`-f gfm`	把输入按 GitHub Flavored Markdown 而不是 Pandoc 扩展 Markdown 解析
`--standalone`	输出包含 `<html>` 和 `<head>` 的完整 HTML 文档，而不是片段
`--toc`	根据正文标题自动生成目录（需与 `--standalone` 一起用）
`--template FILE`	把内容填进自定义 HTML 模板输出
`--embed-resources`	把图片、CSS、脚本内联进文件，生成单一独立文件
`--highlight-style STYLE`	选择代码块语法高亮主题（`pygments`、`kate` 等）

按用途对比

工具	浏览器里能跑	GFM 表格默认支持	需要安装	适合场景
FormatArc（本文工具）	能	能	不需要	粘贴即转的单次操作
marked.js	能	能	需要（`npm`）	网页应用和前端内嵌
markdown-it	能	需插件	需要（`npm`）	自定义语法扩展
remark	能	需插件（`remark-gfm`）	需要（`npm`）	净化、目录生成等多段流水线
Python markdown	不能	需扩展（`tables`）	需要（`pip`）	脚本批处理、数据管道
Showdown	能	需选项（`tables: true`）	需要（`npm`）	老项目维护，也能做 HTML 转 Markdown
Pandoc	不能	能	需要（二进制）	构建流水线、多格式批量

只想粘贴文本拿 HTML 结果，浏览器工具最快。自动化构建用 Pandoc，应用内嵌解析器选 marked.js 或 markdown-it，Python 脚本场景用 markdown 库。

使用转换出的 HTML 时的注意事项

不可信输入必须净化（Sanitize）

Markdown 规范允许直接嵌入原始 HTML 标签。输入里如果有 <script> 标签或危险属性，会原样留在转换结果里。自己写的内容没问题，但处理表单输入或外部用户内容时，渲染前必须过一遍 DOMPurify 这类净化库。

输出不含 CSS

输出的 HTML 只有结构和语义，不带任何样式。贴到博客、CMS 或邮件模板里后，视觉效果由目标平台的默认样式表决定。

代码块的语法高亮

即使代码块指定了语言，输出里也只是给 <code> 加上 class="language-javascript"。真正的语法高亮要在渲染页面里额外引入 Prism.js 或 highlight.js。

常见问题

支持 GFM 吗（表格、任务列表、代码块）？

支持。按 GFM 规范转换，| col1 | col2 | 管道表格、- [x] 任务列表复选框、~~删除线~~、带语言提示的围栏代码块都会正确转成标准 HTML 元素。

转换是在浏览器里完成的吗？

是。Markdown 解析和 HTML 生成都由浏览器内的 JavaScript 完成，文本不会发到服务器。内部文档和个人笔记都可以放心转换。

转换出的 HTML 直接发布安全吗？

自己写的内容可以直接发布。但 Markdown 允许嵌入原始 HTML，如果转换的是来源不可信的输入（比如表单提交），可能夹带 <script> 标签。这种情况渲染前先过 DOMPurify 等净化库。

和 Pandoc 有什么区别？

Pandoc 支持格式多、输出选项细，但需要安装和命令行操作。浏览器工具粘贴点按钮就出结果，单次转换更快。构建自动化和大批量转换还是 Pandoc 更合适。

HTML 也能转回 Markdown 吗？

能。反方向用 FormatArc 的 HTML 转 Markdown 工具，把 HTML 标签去掉、还原成结构化的 Markdown 文本。工具的用法和表格处理细节见 HTML 转 Markdown 指南。

总结

把 Markdown 转成 HTML 在博客发布、HTML 邮件、CMS 录入等场景都会遇到。
单次转换用浏览器在线工具最方便，数据不出本地。
应用开发用 marked.js 或 markdown-it，多段流水线用 remark，批量处理用 Pandoc，Python 脚本用 markdown 库。
转换外部用户输入时，务必用 DOMPurify 净化防 XSS。