html-to-md

一个用于转换HTML为Markdown的工具。English

特点

• 快速，小巧，无任何依赖，gzip 10kb

• 支持nodeJS，参数(html 文本)为字符串

• 200+单元测试和模块测试，覆盖率97%

注意：只有有效规范的 HTML 文本才能准确显示结果，如<p>abc< ，<i>abc</>等都是无效文本

效果

live-demo

为什么做这个工具

最初的动机是希望将leetcode-cn上的题目和自己的解答搬到github， 但是获取的介绍都是html格式文本，因此有了将html转换为markdown的需求。

找了几个工具，结果并不是很合胃口，有的不支持nodejs，有的并不能很好的转换，最终决定自己写一个来用。

刚开始只是写了一个比较简单的，但已经能够处理我的需求。

但后来偶尔一次使用，面对更复杂的html格式，就会出现混乱，这个库也就是一个重构版， 当然，它可能还存在很多bug没有发现，但希望能在后续不断完善，如果有发现bug，请提issue或PR，我会第一时间进行处理。

使用说明

安装

npm -i html-to-md

使用

const html2md = require('html-to-md')
// or if you're using ES6
import html2md from 'html-to-md'

console.log(
  html2md('<strong><em>strong and italic</em></strong>', options, force)
)
// ***strong and italic***

参数(可选)：

options:

名称	数据类型	默认值	说明
skipTags	Array	[ 'div', 'html', 'body', 'nav', 'section', 'footer', 'main', 'aside', 'article', 'header' ]	需要忽略的标签名
emptyTags	Array	[]	不仅忽略它本身，它内部所有标签名全部忽略
ignoreTags	Array	[ '', 'style', 'head', '!doctype', 'form', 'svg', 'noscript', 'script', 'meta' ]	忽视标签及其内部所有内容
aliasTags	Object	{ figure :'p', figcaption:'p', dl:'p', dd:'p', dt:'p' }	为标签定义一个别名(通常作用于一些不常用标签)
renderCustomTags	Boolean |'SKIP' |'EMPTY' |'IGNORE'	true	定义是否渲染自定义标签（非HTML标签）， true：渲染 false | SKIP：添加至skipTags EMPTY：添加至emptyTags IGNORE：添加至ignoreTags
tagListener	Function	(tagName: String, props: TagListenerProps): TagListenerReturnProps => props	自定义当前标签部分属性配置

优先权：skipTags > emptyTags > ignoreTags > aliasTags

例：

html2md('<><b><i>abc</i></b></>', { ignoreTags: [''] })
// ''

html2md('<><b><i>abc</i></b></>', { skipTags: [''] })
// ***abc***

html2md('<><b><i>abc</i></b></>', { emptyTags: [''] })
// abc

html2md('<><b><i>abc</i></b></>', {
  skipTags: [''],
  aliasTags: { b: 'ul', i: 'li' },
})
// *  abc

html2md('<test><b><i>abc</i></b></test>', { renderCustomTags: 'SKIP' })
// ***abc***

force(Boolean)(默认 false)

值	说明
true	表示强制使用自定义配置
false	对自定义配置使用Object.assign操作

例：

// 默认 skipTags 为 ['div','html','body']

// 配置一：
html2md('<div><b><i>abc</i></b></div>', { skipTags: ['b'] }, false)
// skipTags 为 ['div','html','body','b']

// 配置二：
html2md('<div><b><i>abc</i></b></div>', { skipTags: ['b'] }, true)
// 经过配置后 skipTags 为 ['b']

TagListenerProps

key	说明
parentTag	父标签名，没有则为 null
prevTagName	上一个标签名，没有则为 null
nextTagName	下一个标签名，没有则为 null
isFirstSubTag	是否当前父标签内部的第一个子标签
attrs	当前标签的 attributes，以 object 集合方式，例如 { src, href ... }
innerHTML	内部 HTML 字符串
match	当前的 HTML 对应 Markdown 的匹配符号
language?	当前标签语言，只在 pre 标签中出现
isSelfClosing	是否自闭和标签

TagListenerReturnProps

key	说明
attrs	当前标签的 attributes，以 object 集合方式，例如 { src, href ... }
match	返回一个新的自定义匹配符号
language?	返回自定义 pre 标签的 language

支持标签

• a
• b
• blockquote
• code
• del
• em
• h1~h6
• hr
• i
• img
• input
• li
• ol
• p
• pre
• s
• strong
• table
• tbody
• td
• th
• thead
• tr
• ul

Changelog

0.8.8

• fix #77