JavaScriptの外部ファイル

更新日:2018.06.22
  1. HOME
  2. JavaScript入門
  3. JavaScriptの外部ファイル

このページではJavaScriptを外部ファイルで指定する方法について解説します。外部ファイルにソースを書いておくと複数のページから参照することができるので、良く使う関数などを記入しておくと非常に便利です。

外部ファイルの使用方法

外部ファイルを作成する

外部ファイルはJavaScript専用のファイルになります。 従って、HTMLの中にJavaScriptを埋め込む時に使った<script>~</script>記入する必要はありません。 直接JavaScriptのソースを書いていきます。

外部ファイルを保存する時に、拡張子を.jsにします。 こうすることによって、JavaScript専用ファイルになります。

外部ファイルを読み込む

外部ファイルを読み込む場合、以下のように記述します。

<script type="text/javascript" src="JSファイルのパス"></script>
外部JSファイルを読み込みます。

外部ファイルを読み込むのは、bodyタグの中の一番最後に書くのが良いとされています。

外部ファイルを用いたサンプル

今日の曜日を複数のページで表示してみます。

外部ファイルに記入

var yobi = new Array("日","月","火","水","木","金","土");
var today = new Date();
var week = today.getDay();

document.write( yobi[week] + "曜日です。");

上記のように記入して、「week.js」というファイル名で保存します。

JSファイルと同じ場所にsample1.html,sample2.html,sample3.htmlという3つのファイルを作ります。 そして各htmlファイルの中で、下のように記述して「week.js」を読み込みます。

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

サンプル1サンプル2サンプル3(各別窓)

どのファイルからも同じ処理が行なえます。