一个 HTML 文件搞定,不依赖任何库、可完全离线,双击用浏览器打开就能写。
左边写 Markdown,右边实时预览。自带一个「够用就好」的解析器,
支持标题、加粗、斜体、行内代码、代码块、列表、引用、表格、链接。
适合干什么
- 写技术文档、README 草稿,随时复制右侧 HTML
- 当本地笔记工具用(数据不出本机)
- 学 Markdown 渲染原理(解析器就几十行,注释齐全)
实现要点
核心是把每一行分类处理:
if (line.startsWith('```')) { /* 代码块 */ }
else if (h = line.match(/^#{1,6}\s+/)) { /* 标题 */ }
else if (/^\s*>/.test(line)) { /* 引用 */ }
else if (/^\s*[-*+]\s/.test(line)) { /* 列表 */ }
else { /* 普通段落,合并相邻行 */ }
注意:HTML 会先做转义再渲染,避免源码里的
<>把页面搞乱。
授权:本站原创,按 MIT 风格授权——可以随便下载、修改、商用、二次分发,
不用署名,也不担保任何风险。源码里有完整中文注释,改起来不费劲。
楼主 · 2026-09-28 16:00 · 浏览 7

