按 ⌘K 切换工具
TEXT
Markdown预览
编写Markdown并实时预览渲染效果。
markdown-preview
Rendered locally and sanitized with DOMPurify. Nothing is sent anywhere.
§01 关于此工具
概述
一个分栏 Markdown 编辑器:左栏输入,右栏立刻显示渲染结果。解析由 marked 完成,
每一次渲染都经过 DOMPurify 净化,因此内嵌的 HTML 无法向页面注入脚本。适合起草
README、确认一段片段的渲染效果,或者排查 Markdown 语法。
它解决的是一个很具体的麻烦:Markdown 的不少细节(列表嵌套、表格对齐、缩进代码块) 只有渲染出来才知道对不对,而在正式提交之前你通常看不到渲染结果。
使用方法
- 在 Markdown 栏输入或粘贴内容——里面预置了一份很小的样例文档。
- 每次按键,Preview 栏都会跟着更新。
- 反复调整到满意为止,然后从左栏把源码复制走。
示例
**bold** and _italic_→ 预览里的粗体和斜体文本`inline code`和围栏代码块会以等宽字体渲染[links](https://example.com)、# headings和- list items分别渲染为可点击的链接、标题和无序列表
说明
预览只是最终外观的近似。GitHub、GitLab 和各类静态站点生成器各自套用自己的 CSS 和扩展, 因此间距和高级语法在目标平台上可能有出入。被 DOMPurify 判定为不安全的原始 HTML 会被静默地从预览里移除。两栏是同步的,所以定位问题的办法很直接: 一边删一边看,直到出问题的那一段暴露出来。
FAQ
我写的 Markdown 会被发送到服务器吗?
不会。渲染完全在浏览器内通过 marked 库完成,产生的 HTML 在显示之前会用 DOMPurify 净化。不做传输也不做存储。
预览来源不可信的 Markdown 安全吗?
渲染结果会经过 DOMPurify,脚本标签、事件处理属性以及其他危险 HTML 在进入页面之前就被剥离。不过对于不信任的内容,仍然不要去点里面的链接。
支持哪一种 Markdown 方言?
工具使用 marked,支持 CommonMark 以及围栏代码块、自动链接等常见的 GitHub 风格扩展。GitHub 任务列表复选框这类平台专属特性,渲染结果可能与 GitHub 本身不同。