Featured image of post リンク付きの目次を、既存のクラスに触れずに足す。見出しからアンカーIDを作る【開放閉鎖原則】

リンク付きの目次を、既存のクラスに触れずに足す。見出しからアンカーIDを作る【開放閉鎖原則】

見出しテキストを小文字にし、空白をハイフンに変えてアンカー ID を作り、[はじめに](#はじめに) の形のリンク付き目次を出す AnchoredRenderer を足します。ツリーのクラスは書き換えず、レンダラーを1つ足すだけで済みます(開放閉鎖原則)。連載の完成回です。

Featured image of post 同じツリーからMarkdown・HTML・JSONの目次を出す。入れ子のHTMLも再帰で正しく閉じる【複数フォーマット出力】

同じツリーからMarkdown・HTML・JSONの目次を出す。入れ子のHTMLも再帰で正しく閉じる【複数フォーマット出力】

SectionHeading と LeafHeading の render に形式の引数を足し、1つのツリーから Markdown のリスト、入れ子の HTML、JSON を出します。入れ子の ul も、子が自分の子を描く再帰で開け閉めがそろいます。形式の切り替えは各クラスの if/elsif に残ります。

Featured image of post 見出しがH1からH3に飛ぶと、ulが2重に開いて目次のHTMLが壊れる。分岐で塞ぐと増え続ける【条件分岐の爆発】

見出しがH1からH3に飛ぶと、ulが2重に開いて目次のHTMLが壊れる。分岐で塞ぐと増え続ける【条件分岐の爆発】

前の見出しとのレベル差で ul を開け閉めする素朴な HTML 目次は、サンプルでは正しく出ます。ところが H1 の次に H3 が来ると、li のない ul が2重に開く。分岐を足して塞ごうとすると、閉じる数・複数の H1・レベル別のクラスで条件が増え続ける様子を追います。

Featured image of post インデントを足せば目次らしく見える。でも配列には親子関係がなく、入れ子のHTMLは組みにくい【フラット配列】

インデントを足せば目次らしく見える。でも配列には親子関係がなく、入れ子のHTMLは組みにくい【フラット配列】

見出しレベルに応じてスペースを足すだけで、Markdown のリスト形式の目次は出せます。FlatTOCRenderer で実際に表示したあと、どの見出しがどの見出しの下にあるかを持たない配列では、入れ子の ul と li を組むのが難しい理由を見ます。