（自分用）urlからhtmlファイル名を取得し、同名の画像を表示

jQueryにたよってばかりもなんだなとおもい
javascriptの文法学習も兼ねて、簡単な仕組みづくりに挑戦しました。

その記録さえ残せればと。内容は用途の限られた個人利用の地味なjsです。
よってhtml側の記述や使いどころの説明は省略。

覚えたばかりの論理和の式が早速使えて嬉しい。

/**********************************************************
*
*  (Ｗ｀´)X --【 sampleImg.js 】
* 
*  ・デザイン確認用htmlを楽につくるjs
*
*  htmlのurlから画像名を取得し、div#imgBoxの背景に設定。
*  ( http://hoge.com/fuga.html ならば images/fuga.png を読み込み。 )
*  スタイルは別途html側で指定。div#imgBoxの高さのみ、画像から自動取得。
*
*  2013.03.26(Tue)
*  @author raku63
*
**********************************************************/

var pathList = location.pathname.split("/");
var imgName = pathList[pathList.length-1].split(".")[0];  //urlから画像名を決定

//index.htmlへのアクセス時にurlのhtml名が省かれた場合の対処
imgName = imgName || "index" ;                                                       

window.onload = function(){

     var box = document.getElementById("imgBox");
    
     var img = new Image();                               // 画像を生成
     img.src = "images/"+imgName+".png" ;                 // srcを設定することで画像の読み込み開始
    
     //--[ 画像の読み込み完了後に実行 ]--//
     img.onload = function(){                             
          //alert("imgLoadComp");
          box.style.backgroundImage ="url("+img.src+")";  // #imgBoxに背景画像として設定
          box.style.height = img.height + "px";           // #imgBoxに画像から取得した高さを設定
    
     //--[ おまけ・png画像の読み込みエラー時に実行 ]--//
     img.onerror = function(){         
               img.src = "images/"+imgName+".jpg" ;       // 拡張子をjpgにして再読み込み
               img.onerror = null;                        // エラー処理のループを防ぐ
     }
    
}