JavaScript :: 自分自身が設置されているURLを取得する

javascript内で自分自身が設置されているURLを取得する方法です。
それが出来て何がうれしいかというと、例えば下記のようにスクリプト内に画像パスが記述されている場合です。

document.write('<img src="img/001.jpg">');

この javascript を階層の深さが異なる複数のHTMLから読み込みたい場合、スクリプト内で画像パスを指定できません。
画像パスは読み込まれたHTMLからの相対パスとして扱われてしまうからです。

ただし、画像パスを / からの絶対パス や http://からの絶対URL で記述すれば可能です。
ですが、環境に依存してしまい、移植性が失われますのであまりやりたくありません。

このようなケースで、自分自身が設置されているURLを取得できれば、移植性を損なわず画像パスを記述できるようになります。
php の dirname(__FILE__) と同じようなものです。

以下、サンプルになります。

sample.js

(function(){
    var root;
    var scripts = document.getElementsByTagName("script");
    var i = scripts.length;
    while (i--) {
        var match = scripts[i].src.match(/(^|.*\/)sample\.js$/);
        if (match) {
            root = match[1];
            break;
        }
    }
    alert(root);
})();

変数：root にURLが格納されます。
正規表現：sample\.js$ の部分はファイル名によって適宜変更します。

index.html

<html>
<head>

<script type="text/javascript" src="js/sample.js"></script>

</head>
<body>

</body>
</html>

動作確認の例

index.html を下記に設置

http://example.com/hoge/index.html

sample.js を下記に設置

http://example.com/hoge/js/sample.js

index.html と sample.js を設置後、ブラウザで http://example.com/hoge/index.html にアクセスすると
自分自身が設置されているURL http://example.com/hoge/js/ がアラートされます。

programming/javascript/etc/own_path.txt

文書の先頭へ