正则表达式可实现轻量级 Markdown 到 HTML 转换,适用于简单文档、日志渲染等场景,但不支持复杂嵌套;需按行/段落逐层匹配标题、强调、代码、链接等元素,注意顺序、非贪婪匹配及 HTML 转义。

正则表达式可以完成 Markdown 到 HTML 的轻量级转换,适合简单文档、日志渲染或嵌入式场景,但不适用于复杂嵌套(如表格、多层列表、块引用嵌套等)。核心思路是按行或按段落匹配常见 Markdown 元素,逐层替换为对应 HTML 标签,注意匹配顺序和转义处理。
基础文本格式:强调与代码
斜体、粗体、行内代码属于行内元素,应优先处理,避免被后续规则干扰。使用非贪婪匹配防止跨标记误捕。
-
// 斜体:*text* 或 _text_(不跨空格或标点)
/(\*|_)([^*\n]+?)\1/g→<em>$2</em> -
// 粗体:**text** 或 __text__
/(\*\*|__)([^*\n]+?)\1/g→<strong>$2</strong> -
// 行内代码:`code`
/`([^`\n]+)`/g→<code>$1</code>
标题与段落:按行解析结构
Markdown 标题以行首 # 开头,段落是无特殊前缀的非空行。需先按换行符分割,再逐行判断类型。
将 Markdown 格式的回复转换为适合 Telegram 的富文本,避免渲染错误。适用于用户偏好 Markdown 但目标平台为 Telegram 的场景。
-
// 一级到六级标题:# h1、## h2 … ##### h5、###### h6
^#{1,6}\s+(.+)$(多行模式)→<h$1>$2</h$1>(注意捕获组编号) -
// 普通段落:非空且不匹配其他块级规则的行(需前后加 <p></p>)
对剩余未处理行,用^([^\n]+)$匹配后包裹为<p>$1</p>
链接与图片:提取属性并构造标签
链接和图片语法相似,都含方括号+圆括号,区别在于图片多一个前置 !。需确保括号内容不包含未转义的括号。
立即学习“前端免费学习笔记(深入)”;
-
// 图片:
!\[([^\]]*)\]\(([^)\s]+)(?:\s+"([^"]*)")?\)→<img src="$2" alt="$1"$3>(title 可选,可追加title="$3") -
// 链接:[text](url "title")
\[([^\]]*)\]\(([^)\s]+)(?:\s+"([^"]*)")?\)→<a href="$2"$3>$1</a>
安全与边界注意事项
正则转换易受注入与误匹配影响,必须做基础防护:
- HTML 特殊字符需在替换前转义(如
&→&,→ <code><),尤其在段落文本和 alt/title 属性中 - 避免全局贪婪匹配导致长文本吞掉多个结构,所有量词尽量用
+?或*? - 不支持混合结构,例如
**hello *world***会出错;建议预处理——先转义冲突符号(如将内部*替换为\*)或限制输入格式 - 换行符统一为
\n,启用多行标志m处理 ^ 和 $,启用全局标志g实现全部替换


















