如何将html转换成markdown?

简介: 如何将html转换成markdown?

什么是Turndown

"Turndown" 是一个用于将 HTML 转换为 Markdown 的 JavaScript 库。它通常用于将富文本内容从网页或其他 HTML 格式转换为纯文本 Markdown 格式,以便在不同平台上显示或存储。

如果在有node环境的情况下要使用 Turndown,首先需要将它添加到你的项目中。可以使用 npm 或 yarn 安装 Turndown,如下所示:

使用 npm 安装:


npm install turndown

使用 yarn 安装:


yarn add turndown

或者html文件直接引入:


<script src="https://unpkg.com/turndown/dist/turndown.js"></script>

安装完成,可以在项目中使用它。以下是一个简单的示例:


import TurndownService from 'turndown';
const turndownService = new TurndownService();
const html = '<h1>Hello, World!</h1><p>This is a <em>sample</em> HTML document.</p>';
const markdown = turndownService.turndown(html);
console.log(markdown);


无需安装,直接在html文件使用:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <!-- 引入 Turndown 库 -->
  <script src="https://cdn.jsdelivr.net/npm/turndown@7.1.3/dist/turndown.js"></script>
  <title>Document</title>
</head>
<body>
  <script>
    // 创建 TurndownService 实例
    const turndownService = new TurndownService();
    // 要转换的 HTML 内容
    const htmlContent = '<h1>Hello, World!</h1><p>This is a <em>sample</em> HTML document.</p>';
    // 使用 Turndown 进行转换
    const markdown = turndownService.turndown(htmlContent);
    // 输出 Markdown
    console.log(markdown);
  </script>
</body>
</html>

参数

Turndown 提供了一些参数和配置选项,以便更精细地控制 HTML 到 Markdown 的转换过程。以下是一些常用的参数和配置选项:

  1. headingStyle(标题样式): 用于指定生成的 Markdown 标题的样式。可选值包括 "setext"(默认值)和 "atx"。"setext" 样式使用下划线或等号来表示标题级别,而 "atx" 样式使用井号的数量表示标题级别。


const turndownService = new TurndownService({ headingStyle: 'atx' });
  1. hr(水平分隔线): 用于指定生成的 Markdown 水平分隔线的样式。默认是 * * *


const turndownService = new TurndownService({ hr: '- - -' });
  1. bulletListMarker(无序列表标记): 用于指定生成的 Markdown 无序列表的标记。默认是 "*"


const turndownService = new TurndownService({ bulletListMarker: '-' });
  1. codeBlockStyle(代码块样式): 用于指定生成的 Markdown 代码块的样式。默认是三个反引号 "```"。


const turndownService = new TurndownService({ codeBlockStyle: '```' });
  1. fence(代码块标记): 用于指定生成的 Markdown 代码块的标记。默认是 ~~~


const turndownService = new TurndownService({ fence: '```' });
  1. emDelimiter(强调/斜体标记): 用于指定生成的 Markdown 强调(斜体)的标记。默认是 "_"


const turndownService = new TurndownService({ emDelimiter: '*' });
  1. strongDelimiter(粗体标记): 用于指定生成的 Markdown 粗体的标记。默认是 "**"


const turndownService = new TurndownService({ strongDelimiter: '__' });


API

Turndown 提供了一组 API 方法,用于定制和配置 HTML 到 Markdown 的转换过程。以下是一些常用的 Turndown API 方法和选项:

  1. turndown(html: string): 这是 Turndown 的主要方法,用于将给定的 HTML 字符串转换为 Markdown。它返回一个 Markdown 字符串。
  2. addRule(key: string, rule: Rule): 允许你添加自定义规则来处理 HTML 元素的转换。key 是规则的唯一标识符,rule 是一个包含规则定义的对象。
  3. keep(filter: string | RegExp | KeepFilterFunction): 允许你指定哪些 HTML 元素应该保留为原始 HTML,而不进行转换。你可以传递一个字符串、正则表达式或自定义函数来定义保留的条件。
  4. remove(filter: string | RegExp | RemoveFilterFunction): 允许你指定哪些 HTML 元素应该从输出的 Markdown 中完全移除。你可以传递一个字符串、正则表达式或自定义函数来定义移除的条件。
  5. use(plugins: Plugin | Plugin[]): 允许你加载 Turndown 插件,这些插件可以添加额外的转换规则和功能。插件是一种扩展 Turndown 功能的方式。
  6. keepReplacement: 用于自定义保留元素时的替代字符串,默认是 '\n\n'。你可以更改这个字符串以满足你的需求。
  7. addRuleBefore(existingKey: string, newKey: string, rule: Rule): 在现有规则之前添加自定义规则。
  8. addRuleAfter(existingKey: string, newKey: string, rule: Rule): 在现有规则之后添加自定义规则。

市面上还有很多其他html转换markdown的工具,比如html-to-markdown、showdown、remark、Marked 可以根据项目需要和个人喜好去使用。

目录
相关文章
|
6月前
|
JavaScript 前端开发 编译器
Nodejs 第二十三章(Markdown 转 html)
Nodejs 第二十三章(Markdown 转 html)
100 0
|
5月前
|
存储 移动开发 编解码
基于HTML5开发的Markdown在线编辑器
Markdown是一种轻量级标记语言,以其简洁易读的格式而备受程序员和作者们的青睐。随着互联网的发展,越来越多的在线Markdown编辑器应运而生,为用户提供了更加便捷、高效的写作和编辑环境。本文将探讨基于HTML5开发的Markdown在线编辑器的设计原理、功能特点以及技术优势。
118 4
|
3月前
Markdown使用HTML语法实现复杂表格
Markdown使用HTML语法实现复杂表格
130 1
|
3月前
|
JavaScript 算法 前端开发
学习 node.js 六 Markdown 转为 html,zlib
【8月更文挑战第19天】
22 0
|
3月前
Html 表格 在线转 Markdown
Html 表格 在线转 Markdown
42 0
|
4月前
|
自然语言处理 开发者 Python
Markdown 是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档,然后转换成格式丰富的 HTML 内容。Markdown 的语法简洁明了、学习容易,而且功能比纯文本更强。
Markdown 是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档,然后转换成格式丰富的 HTML 内容。Markdown 的语法简洁明了、学习容易,而且功能比纯文本更强。
|
6月前
|
存储 移动开发 编解码
基于HTML5开发的Markdown在线编辑器
Markdown是一种轻量级标记语言,以其简洁易读的格式而备受程序员和作者们的青睐。随着互联网的发展,越来越多的在线Markdown编辑器应运而生,为用户提供了更加便捷、高效的写作和编辑环境。本文将探讨基于HTML5开发的Markdown在线编辑器的设计原理、功能特点以及技术优势。
76 1
基于HTML5开发的Markdown在线编辑器
|
4月前
|
Unix Linux Shell
Sphinx是一个Python文档生成工具,它可以解析reStructuredText或Markdown格式的源代码注释,并生成多种输出格式,如HTML、LaTeX、PDF、ePub等。
Sphinx是一个Python文档生成工具,它可以解析reStructuredText或Markdown格式的源代码注释,并生成多种输出格式,如HTML、LaTeX、PDF、ePub等。
|
6月前
|
数据采集 数据挖掘 Python
Python之html2text: 将HTML转换为Markdown 文档示例详解
Python之html2text: 将HTML转换为Markdown 文档示例详解
469 0
|
12月前
markdown转html插件
markdown转html插件
90 0