パンくず

1. URLの階層ごとに、対応する名称をJavaScriptの変数に設定しておく。
   例えばこのページは、「ルート階層 = TOP」、「programming = 設定なし」、「javascript = JavaScriptサンプル」
   と設定してある。

2. 表示されたURLをパースし、パスに対応する表示文字を「>」で繋いで表示します。

3. 現在表示しているページのタイトルを右端に追加します。
   ページのタイトルは、「idがtitleの要素のinnerHTML」もしくは「ページのtitle」を使用しています。
   双方が存在しない場合は、「この文書」という文字列を表示します。

4. 最後に、「idがpankuzuの要素のinnerHTML」に、出来上がった文字列を挿入します。

  /**
   * パンくず生成用設定
   */
  var documentTitles = new Object();
  documentTitles['webtools'] = '<a href="/programming/webtools/">WEBツールたち</a>';
  documentTitles['javascript'] = '<a href="/programming/javascript/">JavaScriptサンプル</a>';

  /**
   * パンくずの生成
   */
  setPankuzu = function() {

   // HTTPS未対応
    var domain = "http://" + document.domain + "/";
    var path = document.URL.replace(domain, "");
    
    // ルートパスの場合はパンくずを出力しない
    if(path == "/" || path == "" || path == "index.html" || path == "index.html")
      return;

    // スラッシュでsplitする。最終要素は無視
    var splittedPath = path.split("/");
    if(!splittedPath || splittedPath.length < 1)
      return;

    // ファイル名がindexの場合は2階層、それ以外の場合は1階層削る
    var fileName = splittedPath[splittedPath.length - 1];
    if(splittedPath.length > 1 && (fileName == "" || fileName == "index.html"))
      delete splittedPath[splittedPath.length - 2];
    delete splittedPath[splittedPath.length - 1];

    // パンくず用文字列に取得した値を付け加えていく
    var pankuzu = '<a href="/">TOP</a>';
    var splitter = "  >  ";
    for(var i = 0; i < splittedPath.length; i++) {
      if(splittedPath[i] && documentTitles[splittedPath[i]])
        pankuzu = pankuzu + splitter + documentTitles[splittedPath[i]];
    }

    // この文書のタイトルを付け加える
    if(document.getElementById('title') && document.getElementById('title').innerHTML)
      pankuzu = pankuzu + splitter + document.getElementById('title').innerHTML;
    else if(document.title != "")
      pankuzu = pankuzu + splitter + document.title;
    else
      pankuzu = pankuzu + splitter + 'この文書';

    // 生成したパンくず文字列が空でなければ、所定の箇所に内容を表示する     if(pankuzu)
      document.getElementById('pankuzu').innerHTML = pankuzu;
  }