【HTML、ASP.NET、JavaScript】外部ファイルとして作成したJavaScriptファイルを参照する方法

◆この記事で紹介している内容の概要

・外部ファイルとして作成したJavaScriptファイルをHTML上のコードから参照する方法
(ASP.NETで使用する場合のHTMLのコードも記載)
・Scriptタグの構文と実際の使用例

◆この記事で紹介ししていない内容

・外部ファイルとして作成したJavaScript以外のファイルをHTML上のコードから参照する方法





外部ファイルとして作成をしたJavaScriptファイルを参照したい場合はScriptタグを用いて参照を行います。

構文
<script src="<参照先に設定するファイルのファイルパス>" type="text/javascript"></script>

実際に使用する場合はScriptタグをheadタグ内に記載して使用します。

使用例
<head>
    <script src="../JavaScript/JavaScript.js" type="text/javascript"></script>
</head>
ASP.NETでの使用例
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>単体動作確認</title>
    <%--JavaScript参照設定--%>
    <script src="../JavaScript/JavaScript.js" type="text/javascript"></script>
</head>
ファイル参照がうまくいかない場合

まれに作成したJavaScriptファイルがうまく読み込めず、関数を実際に呼び出した時に"●●は定義されていません"と表示されることがあります。
基本的に考えられる間違いとしては

・参照先のファイル名およびパスが間違って記載されている。
・Scriptタグの設定内容または設定箇所に誤りがある。

上記の2つが考えられます。
ただ、上記の2つの点に問題が無い場合でもJavaScriptをうまく参照できない時があるので、それに関してはわかりません。

動作環境

・使用OS:Windows10 Home
IE Version:11.590.17134.0
・VisualStudio Community 2017