使用outline.js为文章H标签自动生成导航目录（Table of Contents）方法
参考链接：
1、https://github.com/yaohaixiao/outline.js
2、https://yaohaixiao.github.io/outline.js/relative.html
3、https://yaohaixiao.github.io/outline.js/flex.html
4、https://yaohaixiao.github.io/outline.js/
引用的资源：
<link href="https://cdn.jsdelivr.net/gh/yaohaixiao/outline.js/outline.min.css" rel="stylesheet" /> <script src="https://cdn.jsdelivr.net/gh/yaohaixiao/outline.js/outline.min.js"></script>
部分说明：
// Node.js 环境中使用
const Outline = require('@yaohaixiao/outline.js')
// 调用其他独立模块（如果需要）
const Anchors = require('@yaohaixiao/outline.js/anchors.min.js')
const Chapters = require('@yaohaixiao/outline.js/chapters.min.js')
const Drawer = require('@yaohaixiao/outline.js/drawer.min.js')
const Toolbar = require('@yaohaixiao/outline.js/toolbar.min.js')
// 作为 ES6 模块使用
import Outline from '@yaohaixiao/outline.js/outline'
// 调用其他独立模块（如果需要）
import Anchors from '@yaohaixiao/outline.js/anchors'
import Chapters from '@yaohaixiao/outline.js/chapters'
import Drawer from '@yaohaixiao/outline.js/drawer'
import Toolbar from '@yaohaixiao/outline.js/toolbar'
// 创建 Outline 实例
// 2.0.0 调整了配置参数，配置更加简单
// 当然，可以直接使用 DEFAULTS 静态属性，
// Outline.DEFAULTS 就是一下的默认配置
const outline = new Outline({
// 文章显示区域的 DOM 元素或者选择器字符串
articleElement: '#article',
// 要收集的标题选择器
selector: 'h2,h3,h4,h5,h6',
// 指定文章导读导航菜单的标题文字。
// 设置空字符串或者 false，则不显示标题
// 在插入导航菜单的 DOM 元素已有标题时，可以设置 title: '' 或者 false
title: '目录',
// 负责文章区域滚动的元素
// String 类型 - 选择器字符串，默认值：html,body（window窗口）
// HTMLElement 类型 - DOM 元素
scrollElement: 'html,body',
// 文章导读菜单的位置
// relative - （默认值）创建独立的侧滑菜单
// sticky - 导航菜单将以 sticky 模式布局（需要确保菜单插入位置支持 sticky 模式布局）
// fixed - 导航菜单将以 fixed 模式布局，会自动监听滚动位置，模拟 sticky 布局
// sticky 和 fixed 布局时，需要设置 parentElement
// 2.0.0 暂时不支持之前版本那种 inside 模式，不会自动在文章开始位置插入 chapters 导航菜单
position: 'sticky',
// 导航菜单将要插入的位置（DOM 元素）
// String 类型 - 选择器字符串
// HTMLElement 类型 - 插入的 DOM 元素
// 仅在 position 设置为 sticky 和 fixed 布局时有效
parentElement: '#aside',
// 设置 position: relative 时，placment 定义侧滑菜单和 toolbar 导航位置：
// rtl - 菜单位置在窗口右侧，滑动动画为：right to left
// ltr - 菜单位置在窗口左侧，滑动动画为：left to right
// ttb - 菜单位置在窗口上方，滑动动画为：top to bottom
// btt - 菜单位置在窗口下方，滑动动画为：bottom to top
placement: 'rtl',
// 页面中其它 sticky 或者模拟 skicky 的 fiexed 定位的 DOM 元素的高度。例如 wordpress 系统中，
// 就会有 sticky 定位的导航菜单。这些 sticky 元素脱离了正常的流布局后，原来 h1~h6 标题标签的
// offsetTop 计算会出现偏差。sticky 元素会遮挡标题，因此针对页面中有其它 sticky 元素会遮挡标题，
// 因此针对 sticky 布局时，需要设置 stickyHeight 高度。outline.js 会根据 stickyHeight 和计
// 算出的标题的 offsetTop 值重新计算滚动定位；
// 说明：outline.js 主要用于文章详情页面，
// 因此 stickyHeight 仅针对 top: 0，且 sticky 定位元素在文章内容区域上方的位置；
stickyHeight: 0,
// 是否显示标题编号
showCode: true,
// 指定是否采用动画定位高亮当前的章节标题，默认值：true
// 当值为 false 时，则采用高亮当前章节标题的链接文字并加粗文字
// 如果喜欢更简洁的高亮效果，可以选择设置为 false
animationCurrent: true,
// 是否显示侧边的按钮工具栏
hasToolbar: true,
// 标题图标链接的 URL 地址
// （默认）没有设置定制，点击链接页面滚动到标题位置
// 设置了链接地址，则不会滚动定位
anchorURL: '',
// 指定当前站点主页地址
homepage: '',
// 指定git仓库地址
git: '',
// 指定git仓库中的 tags 地址
tags: '',
// 指定git仓库中的 issues 地址
issues: '',
// 自定义按钮配置
tools: [],
// 为文章页添加基础的打印样式
// 如果您的页面已经有打印样式，就无需设置了
print: {
//（必须）要打印的文章区域，DOM 元素或者选择器字符串。
element: '',
// （可选）要打印的文章标题。如果 element 区域有 h1 标签则无需设置。
// 可以直接设置标题文本，也可以是文章页的主标题 DOM 元素
title: '',
// 进入阅读模式的提示消息文本
enterReadingTip: '进入阅读模式，按 ESC 键可退出阅读模式'
},
// DIYer的福利
// 独立侧滑菜单时，customClass 会追加到 drawer 侧滑窗口组件
// 在文章中显示导航菜单时，customClass 会追加到 chapters 导航菜单
customClass,
// position: fixed，当导航菜单样式进入 fixed 定位后，触发的回调函数
afterSticky: null,
// 当导航菜单隐藏或者显示后，触发的回调函数
afterToggle: null,
// 当点击上下滚动按钮，导航菜单或者文章中的 # 图标，滚动结束后触发的回调函数
afterScroll: null,
// 文档的标题文本过滤回调函数
// API 文档中，正文的方法会添加参数等信息，例如：getChapters(headings, showCode, chapterTextFilter)
// 而在 chapters 导航菜单，我希望显示为 getChapters()，这时我们就可以借助 chapterTextFilter 回调函数
// 对原始的文本进行过滤，返回我们期望的 getChapters() 文本
chapterTextFilter: null
});
// 可以在创建导航后，重置配置信息，重新生成新的导航
Outline.reload({
// 调整位直接在文章内生成导航
position: 'sticky',
articleElement: '#article'
})