自動で目次を作ってくれるスクリプトを作ってみた

投稿内の見出し要素をチェックして、目次を作ってくれるスクリプトを作ってみました！

スクリプトを埋め込んで、目次を挿入したい要素に id 属性といくつかのオプションを指定するだけで使うことができます。


jsdo.it で公開中
上記のサンプルでは、いくつかのオプションを設定しています。もともと、このスクリプトを作り始めた目的は「ブログテーマのアウトライン構造を解析する」というためのものでした。なので、デフォルトでは投稿の目次ではなく、表示しているHTML全体のアウトラインを表示するようになっています。目次を作るのはその技術の応用です。

ということで、何もオプションを指定しないと以下のようにサイドバーも込みで表示します。

画像のように、サイドバーやヘッダー、フッターの情報も込みのアウトラインが作られます。
ぐぬぬ。いろいろ調整したいところが出てきましたぞ～。

せっかくなので、Blogger用に調整してHTML/JavaScriptガジェットに入れられるように改良しようかな～、なんて思ってます。 あとは、投稿の「追記の区切り」のあるところに目次を入れる、なんていう機能も面白いかもしれませんね。