[ jQuery ] 自動的に目次を生成する

jQuery で記事の中にある h2 要素を抜き出して、自動的に目次を生成するコードを試してみました。

基本的に、[サイト内の目次を jQuery で自動で作成するチュートリアル](http://phpspot.org/blog/archives/2009/08/jquery_21.html) を参考にさせて頂きました。
ありがとうございます。

設置方法
———————————————————————-

head 要素内に次の記述を追加します。

次のコードを、どうにかして読み込ませます。

// 自動的に目次を生成する

tocdata = “”;

tocdata = “

この記事の目次

“;

$(“div#extended h2”).each(function(i) {
var current = $(this);
current.attr(“id”, “title” + i);
tocdata += “

• ” + current.html() + “

“;
});

tocdata += “

“;

// div#extended 内の最初の h2 要素の前に追加
$(“div#extended h2:first”).before(tocdata);

参考にさせてもらったページ
———————————————————————-

目次自動生成の jQuery プラグインもあるみたいです。

– [目次の自動生成を行う jQuery.exTOC.js – Cyokodog :: Diary](http://d.hatena.ne.jp/cyokodog/20090531/jQueryExTOC01)
– [jQuery版：タブパネルと目次作成](http://www.comm.twcu.ac.jp/~nabe/Ajax/jQuery/Tab.html)
– [JavaScriptで目次を自動作成 – SHIGETA BLOG](http://shigeta.net/blog/2008/12/javascript-de.html)
– [ページの目次を自動で作成するjavascript「jqTOC」｜skuare.net](http://www.skuare.net/2008/08/javascriptjqtoc.html)

ありがとうございます。