HTMLにおけるbaseタグの使い方を説明します。

requireJSでは、baseURLという属性があります。baseURLを設定することで、現在のページからの相対パスではなく、プロジェクトからの相対パスで読み込むファイルのパスを記述することができます。

例えば、私たちのプロジェクトディレクトリが/myproject/で、その中に2つのページがあり、1つは/myproject/one.html、もう1つは/myproject/html/other.htmlで、どちらも/myproject/js/some.jsをロードしなければならないと仮定します。baseURLを/myproject/に設定すると、そのjsを読み込むときに、両方のページがプロジェクトからの相対パスを使うことができます。ページへのパスが異なるため、異なる相対パスを使用するのではなく、/js/someを使用することができます。

しかし、requireJSを使わずにbaseURLのようなものを実現できるのでしょうか？

ベースタグ
実は、HTMLには同様の機能を生み出すbaseタグが存在します。例として

相対パスで読み込んだ画像は、. /images/logo_gray.gifで読み込んだが、http://static.cnblogs.com/images/logo_gray.gif的图片 であることが分かる。

baseタグは、ページのリンクにデフォルトのパスを追加したり、リンクの開き方をデフォルトで指定したりすることができます。

以下は、デフォルトの開き方を設定する例です。

バグ
baseタグは動的に書かない方が良い。そうしないと、FirefoxやIEで、例えばページhttp://localhost/static/test.html、小さなバグが発生する。

FirefoxとIEは、まずhttp://localhost/static/static/1.jpg、次にhttp://localhost/static/1.jpg を読み込みます。つまり、どちらも最初に現在のページからの相対パスで読み込み、次にbaseタグで設定されたデフォルトパスで読み込もうとするのです。

Chromeは問題なく読み込めます。

Firefoxが正しく読み込まれません。

なぜ？

これに対する良い説明は見つかりませんでした。我々の分析では、ブラウザがリソースの読み込みに最適化されているため、ベースタグの動的挿入が有効でないときにプリロードされ、エラーが発生し、その後ベースタグが有効になって正しいリソースを再度読み込むというものです。

どうすれば回避できるのか？ baseタグを動的に書き込まないのであれば、問題はありません。baseタグを動的に記述する必要がある場合、そのページから参照されるすべての外部リソースは、Javascriptによって動的に読み込まれる必要があります。