告别繁琐，轻松渲染 Markdown：Marked.js 入门指南

作为一名前端开发者，经常会遇到将文本内容转换为可视化的需求。Markdown 作为一种简洁易用的标记语言，成为了许多人首选。今天就来介绍一个强大的 Markdown 解析库 - Marked.js，让你轻松将 Markdown 文本渲染成 HTML。

https://github.com/markedjs/marked

为什么选择 Marked.js?

  • 速度飞快: Marked.js 采用低级编译器，解析速度极快，不会因为长时间解析而阻塞页面。
  • 轻量级: 虽然功能强大，但 Marked.js 体积轻巧，不会增加你的项目负担。
  • 全面支持: 支持所有主流 Markdown 语法，并能根据你的需求进行配置。
  • 多平台: 可以在浏览器、Node.js 以及命令行环境中使用。

上手体验：

  1. 演示: 想要快速体验 Marked.js 的强大功能，可以访问 官方演示页面。

  2. 文档: 官方文档 https://marked.js.org/ 非常详细，涵盖了所有功能和使用方法。

  3. 安装: 使用 npm 安装：

    npm install marked

  4. 使用: 在浏览器中，可以使用 <script> 标签引入 Marked.js，然后调用 marked.parse() 方法将 Markdown 文本解析成 HTML：

    <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<div id="content"></div>
<script>
  document.getElementById('content').innerHTML = marked.parse('# 我是标题\n这是一个段落');
</script>

  5. 命令行: 使用 marked 命令将 Markdown 文件转换为 HTML 文件：

    marked input.md -o output.html

安全提示:

Marked.js 不自带 HTML 净化功能，请务必在渲染后的 HTML 中使用安全库（例如 DOMPurify）进行净化，防止跨站脚本攻击。

总结:

Marked.js 是一款功能强大、易于使用的 Markdown 解析库，能够帮助你快速将 Markdown 文本渲染成可视化的 HTML。