岩石教程

Markdown.js

2024-06-25 16:23:17 126
Markdown.js 是一个轻量级、易于使用的 JavaScript Markdown 解析器，能够将 Markdown 文本转换为 HTML。它设计简洁，适用于需要快速集成 Markdown 解析功能的项目。

特点

  • 轻量级: 代码库小，适合在浏览器和 Node.js 环境中使用。
  • 易于集成: 简单的 API 和快速的集成步骤，适合初学者和快速开发需求。
  • 兼容性: 支持常见的 Markdown 语法，适用于大多数 Markdown 使用场景。
  • 开源免费: 源代码公开，免费使用，方便开发者进行定制和扩展。

使用场景

  • 博客和文章发布平台
  • 文档和知识库系统
  • 论坛和社区网站
  • 在线 Markdown 编辑器
  • 快速原型设计和开发

安装方式

使用 npm 安装

npm install markdown

或者直接在 HTML 中引入

<script src="https://cdn.jsdelivr.net/npm/markdown/lib/markdown.js"></script>

使用示例

在 Node.js 环境中使用 Markdown.js 将 Markdown 转换为 HTML

const markdown = require('markdown').markdown;

const markdownString = '# Hello, Markdown.js!';
const htmlString = markdown.toHTML(markdownString);

console.log(htmlString);

在浏览器环境中使用

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Markdown.js Example</title>
  <script src="https://cdn.jsdelivr.net/npm/markdown/lib/markdown.js"></script>
</head>
<body>
  <h1>Markdown.js Example</h1>
  <div id="content"></div>
  <script>
    const markdownString = '# Hello, Markdown.js!';
    const htmlString = markdown.toHTML(markdownString);
    document.getElementById('content').innerHTML = htmlString;
  </script>
</body>
</html>

常用 API 介绍

1. markdown.toHTML(markdownString)

描述: 将 Markdown 字符串解析为 HTML 字符串。

参数:

  • markdownString: 字符串，包含要解析的 Markdown 内容。

示例:

const htmlString = markdown.toHTML('# Hello, Markdown.js!');
console.log(htmlString);

2. markdown.parse(markdownString)

描述: 将 Markdown 字符串解析为抽象语法树（AST）。

参数:

  • markdownString: 字符串，包含要解析的 Markdown 内容。

示例:

const ast = markdown.parse('# Hello, Markdown.js!');
console.log(ast);

3. markdown.toHTMLTree(markdownString)

描述: 将 Markdown 字符串解析为 HTML 树结构。

参数:

  • markdownString: 字符串，包含要解析的 Markdown 内容。

示例:

const htmlTree = markdown.toHTMLTree('# Hello, Markdown.js!');
console.log(htmlTree);

4. markdown.renderJsonML(jsonml)

描述: 将 JSONML（JSON Markup Language）结构解析为 HTML 字符串。

参数:

  • jsonml: JSONML 结构，表示 HTML 树。

示例:

const jsonml = ["markdown", "Hello, Markdown.js!"];
const htmlString = markdown.renderJsonML(jsonml);
console.log(htmlString);

高级用法

自定义解析规则: Markdown.js 允许开发者自定义解析规则，通过修改默认解析器的行为来满足特定需求。

示例:

const markdown = require('markdown').markdown;

function customRule(input) {
  return input.replace(/:smile:/g, '😄');
}

const markdownString = 'Hello :smile:';
const htmlString = markdown.toHTML(customRule(markdownString));
console.log(htmlString); // 输出 <p>Hello 😄</p>

官方资料