Markdown 生成目錄

1. 前言

目錄是文章內(nèi)容的整體索引，是文章結(jié)構(gòu)的最直觀表現(xiàn)形式。

Markdown 為生成目錄提供了快捷方式，大大降低了文章目錄的編排復(fù)雜度。

環(huán)境說明：
考慮到 Markdown 工具之間的不兼容，有的內(nèi)容直接從頁面復(fù)制粘貼到本地不會正常顯示，大家學(xué)習(xí)時自己動手寫是肯定沒問題的。本節(jié)所有實(shí)例代碼及演示效果均使用 Typora 工具完成。
「TOC」是 Markdown 擴(kuò)展語法，Typora 默認(rèn)已支持該擴(kuò)展。

2. 語法詳解

2.1 目錄的自動生成

在 Markdown 中，自動生成目錄非常簡單，只需要在恰當(dāng)?shù)奈恢锰砑?[TOC] 符號，凡是以 # 定義的標(biāo)題都會被編排到目錄中。

實(shí)例 1：

使用 [TOC] 生成文檔目錄導(dǎo)航。

[TOC]

# 一級標(biāo)題

一些內(nèi)容。。。。

## 二級標(biāo)題

一些內(nèi)容。。。。

### 三級標(biāo)題

一些內(nèi)容。。。。

渲染效果如下：

其 Html 內(nèi)容如下：

<div class="md-toc" mdtype="toc">
	<p class="md-toc-content" role="list">
    <span role="listitem" class="md-toc-item md-toc-h1" data-ref="n2">
      <a class="md-toc-inner" href="#一級標(biāo)題">一級標(biāo)題</a>
    </span>
    <span role="listitem" class="md-toc-item md-toc-h2" data-ref="n3">
      <a class="md-toc-inner" href="#二級標(biāo)題">二級標(biāo)題</a>
    </span>
    <span role="listitem" class="md-toc-item md-toc-h3" data-ref="n4">
      <a class="md-toc-inner" href="#三級標(biāo)題">三級標(biāo)題</a>
    </span>
  </p>
</div>

2.2 手動書寫目錄

盡管自動生成目錄非常方便，我們也難免有自定義目錄的需求，如只顯示一二級大標(biāo)題等。

手動添加目錄的方法就是將「列表」和「頁內(nèi)超鏈接」相結(jié)合。

實(shí)例 2：

用列表和鏈接做出目錄效果。

- [一級標(biāo)題](#一級標(biāo)題)
  - [標(biāo)題 1-1](#二級標(biāo)題 1-1)
  - [標(biāo)題 1-2](#二級標(biāo)題 1-2)
- [二級標(biāo)題](#二級標(biāo)題)
  - [標(biāo)題 2-1](#二級標(biāo)題 2-1)
  - [標(biāo)題 2-2](#二級標(biāo)題 2-2)
- [一級標(biāo)題](#一級標(biāo)題)
  - [標(biāo)題 1-1](#二級標(biāo)題 1-1)
  - [標(biāo)題 1-2](#二級標(biāo)題 1-2)
- [二級標(biāo)題](#二級標(biāo)題)
  - [標(biāo)題 2-1](#二級標(biāo)題 2-1)
  - [標(biāo)題 2-2](#二級標(biāo)題 2-2)

# 一級標(biāo)題
一些內(nèi)容……
## 二級標(biāo)題 1-1
一些內(nèi)容……
## 二級標(biāo)題 1-2
一些內(nèi)容……
# 二級標(biāo)題
一些內(nèi)容……
## 二級標(biāo)題 2-1
一些內(nèi)容……
## 二級標(biāo)題 2-2
一些內(nèi)容……

其渲染效果如下：

3. 使用場景

目錄適用于有章節(jié)標(biāo)題的文章，通常用于跳轉(zhuǎn)，所以適合在網(wǎng)頁或 PDF 文件中使用。

4. 小結(jié)

• Markdown 支持自動使用 [toc] 標(biāo)記生成目錄；
• 當(dāng)自動生成的目錄無法滿足需求時，我們?nèi)钥赏ㄟ^「頁內(nèi)超鏈接」的形式定義目錄；
• 由于 Markdown 沒有分頁的概念，所以目錄中無法自動頁碼。