スポンサーリンク

はてなダイアリーのブログ記事内容に「ページ内目次」を自動生成するフォーム (もくじジェネレータforはてだ)

はてなダイアリーのブログ記事内容に,「ページ内目次」を生成するフォーム。

はてなのブログ記事内容に,自動で「ページ内目次」を生成するJSフォーム
http://name-of-this-site.org/func/Gen...

  • ブログ記事に,ページ内目次を生成します。JavaScriptでテキストを解析・加工しています。


はてな記法で書かれた,ブログ記事内容のソースをペーストする。


記事の冒頭にページ内目次ができ,
また各見出しには,目次(トップ)へ戻るリンクが設置される。


処理としては,ブラウザ上でJSでテキスト解析している。

ページ単体で動作し,サーバ通信は必要ない。

他の目次生成方法

はてなグループだと,目次記法を使える。

はてなグループ - はてなグループのヘルプ
http://g.hatena.ne.jp/help#contentssy...

  • 目次記法を利用すると、日記やキーワード中で利用している見出し、小見出しを自動的に目次として生成します。 たとえば日記中で [:contents] と記述すると、その日(キーワード)に含まれる見出し、小見出し、小々見出しまでをリストで一覧表示します。

また,はてなブログだとJavaScriptのカスタマイズが可能で,

記事を開いた時に動的に頁内のh3要素を解析して,目次をスクリプトで生成する,という手がある。

はてなブログで本文の上に自動で目次を表示する方法 - はてなブログ脱獄ブログ
http://datsugoku.hatenablog.jp/entry/...

  • JavaScript(設定→デザイン→カスタマイズ→記事→記事上)


はてなブログの記事ページに目次を表示するためのカスタマイズ - No Hack No Life
http://nohack-nolife.hatenablog.com/e...

  • 上記のjavascript(JQuery)では以下の処理を定義しています。 記事内のh2見出し全てに対してsection + (見出しの番号)のidを付与する 「.entry-content」の一番最初(記事の一番最初)に目次リストを生成 目次から見出しへのスクロール処理を定義


1分で導入可能!はてなブログの記事に目次を自動挿入するプラグインを作りました - 空想の伝説
http://goule.hatenablog.com/entry/201...

  • そういうjQueryプラグインを作った

関連する記事:

はてなダイアリーに執筆した記事一覧を,表形式に整理するブックマークレット (アーカイブページを,Excelに貼り付けやすく整形加工)
http://language-and-engineering.hatenablog.jp/entry/20140102/p1


迷路をウネウネと生成する,ライフゲーム的なJavaScript (アスキーアートで反復描画アニメーション)
http://language-and-engineering.hatenablog.jp/entry/20140624/CreateMeiroJavaS...


開いている全タブのURLとタイトルを,列挙して抽出するFirefoxアドオン (XUL形式プラグインのソースコード付)
http://language-and-engineering.hatenablog.jp/entry/20121221/p1


あなたが,勝つことも引き分けることもできない三目並べ (jQueryプラグイン「jQuery.fakeTicTacToe.js」によるマルバツ・ゲーム)
http://language-and-engineering.hatenablog.jp/entry/20121204/jQueryFakeTicTac...