• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:JavaScriptによる目次の自動生成について)

JavaScriptによる目次の自動生成について

このQ&Aのポイント
  • 現在、私はiswebにサイトをもっており、そのページで目次が自動生成されるようにしたいと考えています。
  • phpなどは利用できないのでjavascriptで何とかしたく、googleで検索したところ次のようなページを見つけました。"Table of Contents script"
  • この方法を試してみたいのですが、解説が英語であり、何よりも私がjavascriptについてほとんど分かっていないため、どうしてもうまくいきません。

質問者が選んだベストアンサー

  • ベストアンサー
  • hrm_mmm
  • ベストアンサー率63% (292/459)
回答No.3

とりあえず、今すぐ可能というところでは、ご呈示のJavaScriptでいきましょうか。 JavaScript offだと表示出来ないのはしかたのないところですが。 でも、そのページには利用法が書いてないので、関数内の解説で解る人は、解説読まなくても、scriptを見れば使い方も解るよってところですね。 そのうえMACのIE5.2ではcrashするとも書いてあるので、来訪対象者によってはbrowserチェックしたうえで実行するようにした方がよいかも?。 使い方は、 まずは、御記載の通り2つ必要で、合体して一個の外部ファイルにするのは問題なし。 あとは、本体htmlに以下を挿入,id="top_index"についてはユニークなもので有ればよい。ただし、createTOC()内で既に使われているものは使わないように。 ーーhead内にーー <script type="text/javascript" > window.onload = function(){ var toc = createTOC(); if( toc) document.getElementById('top_index').appendChild( toc ); } </script> ーーbody内のindex表示をしたいところにーー <div id="top_index"></div>

world0621
質問者

お礼

どうもありがとうございます。 お蔭さまで完璧に、私の希望通りに動いてくれるようになりました。 厚くお礼申し上げます。 お礼の序というわけではありませんが、もう一つ追加で質問しても宜しいでしょうか。 この"Table of Contents script"は、ページを開いた初期状態では目次が隠れており、"show page contents"をクリックしてはじめて目次が表示されます。 しかし、ページを開いた時点ですでに目次が表示されているようにするにはどうすればよいのでしょうか。 追加質問がここでのルールやマナーに反するようでしたら撤回しますが、もしご回答を頂戴できれば幸いです。

その他の回答 (3)

  • hrm_mmm
  • ベストアンサー率63% (292/459)
回答No.4

operaやmozillaでチェックしたところでは、初期状態では表示ですけど? 「show page contents」の文字をクリックしても、一回目はここがhideになるだけでリンク文字列は表示のまま、2日目のクリックから消えて表示してのトグルになるけど。 スタイルシートか何かでわざわざ消してるのでしょうか? トグル文字と連動して一回目のクリックで消えるようにというなら、window.onloadの最後に一行足して下さい。 window.onload = function(){ var toc = createTOC(); if( toc) document.getElementById('top_index').appendChild( toc ); showhideTOC(); }

world0621
質問者

お礼

本当にありがとうございます。 ご提示くださった1行を加えたところ、お蔭様で初期状態からちゃんと表示されるようになりました。 また、ご説明するのが遅くなってしまい申し訳ありませんが、このスクリプトの配布元のCSSも一緒にコピーしてテストしていましたため、その影響もあったようです。 CSSから1行削除したところ、初期状態からちゃんと表示されるようになりました。 ただ、大変申し上げづらいのですが、動作確認をしていたらもう一つ別の問題が見付かってしまいました。 配布元のオリジナルは初期状態で目次が表示されないようになっていたため、表示されていても、どこか見出しへのアンカーをクリックすると目次が「初期状態」に戻って勝手に閉じてしまうのです。 配布元でも "In addition, it's called whenever the user clicks on a link. This immediately hides the ToC." と解説されています。 どうにかしてこの機能を取り除き、「目次が開閉するのは"... page contents"をクリックした時だけ」になるように設定することはできないものでしょうか。 showhideTOC()の'none'と'block'を入れ替えてみたりと、素人考えでいろいろ試してみたのですがどうしてもうまくいきません。 厚かましいお願いであることは承知していますが、もしご回答くだされば幸いです。 よろしくお願いいたします。

noname#36864
noname#36864
回答No.2

http://www.quirksmode.org/dom/getElementsByTagNames.html 単純にこのページのgetElementsByTagNamesと言う関数を貼りつければ良いと思いますよ。 まだ足りない関数があるようなら同じように探して貼りつければ動くと思います。

world0621
質問者

お礼

ご回答ありがとうございます。 ほぼ解決しました。

  • ANASTASIAK
  • ベストアンサー率19% (658/3306)
回答No.1

まずもって、そもそも「目次の自動生成」とはなんぞやという ところを説明してもらえないと、アドバイスのしようもないで す。通常はCGIなどを使ってHTMLに吐き出させます。そうい うものをお望みなら、JavaScriptでは無理です。

world0621
質問者

補足

回答ありがとうございます。 また、私の説明不足で申し訳ありませんでした。 ここでいう「目次の自動生成」とは、「ページ内の見出しタグから目次を自動生成する、Wikipediaなどにある機能」のことです。 "Table of Contents Generator" http://bono.s201.xrea.com/2006/05/130-toc_generator/ のようなプラグインがあるのは知っていましたが、cgiでも出来るとは知りませんでした。 そういったcgiを紹介しているページをご存知でしたらお教えください。 また、私は "Table of Contents script" http://www.quirksmode.org/dom/toc.html のjavascriptでも同様の働きをしてくれるものと考えておりましたが、違うのでしょうか。

関連するQ&A