SF的文章markdown展现及侧边栏是如何实现的

Question

RT，SF的mardown编辑器中编辑完后发布的文章可以按markdown的样式展现在页面，而且可自动生成目录，滚动页面时右侧的目录可按内容锚点高亮。

我的问题是

• 如何读取markdown内容转化成html插入页面

• 读取的内容如何生成目录

• 滚动页面时如何实现右侧高亮展示效果

Answer 1

• 如何读取markdown内容转化成html插入页面
  前端使用 hyperdown.js 做 md 的解析，检测到用户输入立即渲染。

• 读取的内容如何生成目录
  原理并不复杂：遍历文章中所有 heading <h1> - <h6>，用 DOM 生成一个目录 tree

• 滚动页面时如何实现右侧高亮展示效果
  检测当前视窗里可见的第一个 heading，找到侧栏相对应的，滚动到合适的位置

Answer 2

scrollspy

Answer 3

111

"result":0 // success