少し長い文書をＨＴＭＬ文書で作ると、縦長の文書になってしまってスクロールして読まなくてはならないのでわずらわしく感じることがある。こんなとき、ひとつのＨＴＭＬ文書に適当なサイズの複数のページを詰め込むことができたら便利だ。JavaScript を使うとそんな HTML 文書を簡単に作成することができる。
このページを読んでいるということは、前のページの「次へ」をクリックしたはずだ。実は「次へ」のリンクは別のＨＴＭＬ文書へのリンクではなく、goto('p2') という JavaScript で書いた関数へのリンクなのだ。
goto('p2')が何をするかというと、現在表示中ののdiv要素の内容を表示させないようにした後、id が 'p2' のdiv要素を表示させるのだ。
ひとつのＨＴＭＬ文書に記述した複数のページとは、複数のdivタグのなかに記述された HTML 文書のことだ。スタイルシートを使って、それらのdiv要素は、位置をそろえて、最初は全部を表示しないように設定してある。それらの、div要素をひとつずつ表示しては消していくというのが、基本的なアイディアなのだ。
複数のページをひとつのHTML文書にまとめるこの方法の利点は、div要素の中には普通にＨＴＭＬ文書を作成することができるということだ。リンクやイメージやレイアウトも自由に行うことができる。
複数のページからなる文書をひとつのHTML文書にまとめることの利点は、文書を作成するときの操作が煩雑にならないということだ。ファイル名はひとつで良いし、小さなＨＴＭＬ文書を何個も作成する手間が省ける。移動もコピーも簡単に行える。
具体的なスクリプトは、この文書のソースを表示させると見ることができる。一個のスタイルシートと、たった2個の関数だけでできた、非常に簡単なスクリプトだ。
著作権は放棄します。自由にお使いください。