JavaScript
404 Not Found(スクリプトが読み込まれない)
script の src パスが間違っている
こんな症状
コンソールに 404 エラーが出て、JavaScript が動かない。scriptタグのパスを間違えたときに起きるよ。
まず試す
<script src> のファイル名・パスが実物と一致しているか確認する。
js
<script src="app.js"></script>これで直らなければ、下の「自分のケース」を確認。
🔍 自分のケースはどれ?
- ✓ファイル名のスペルミス
→ 実ファイル名と一致させる(ap.js → app.js 等)。 - ✓別フォルダにある
→ src="js/app.js" のようにパスを書く。 - ✓どのファイルが404か不明
→ DevToolsのNetworkタブで404のファイルを特定する。
なぜ起きる?
HTMLの<script src="...">に書いたファイルパスが間違っているよ。ブラウザは指定されたパスにJSファイルを探しに行くけど、見つからないと404エラーを返すんだ。ファイル名のスペルミス、拡張子の間違い、フォルダ階層の間違いが主な原因だよ。
✕ エラーが起きるコード
<script src="ap.js"></script>
<!-- ファイル名スペルミス -->✓ 直したコード
<script src="app.js"></script>
<!-- 正しいファイル名 -->✅ 直ったか確認
Networkタブで script が200で読み込まれ、JSが動けばOK。
この解決法は役立ちましたか?
🔗 関連するエラー
- Uncaught ReferenceError: xxx is not defined — 変数・関数名のタイポ
- Uncaught TypeError: Cannot read properties of null (reading 'addEventListener') — 取得しようとしたHTML要素が見つかっていない
- 計算結果が NaN になる — 文字列を数値に変換していない
- TypeError: xxx is not a function — 関数でないものを呼び出している
- console.log を書いたのに何も表示されない — 開発者ツールを開いていない
🔗 別カテゴリの関連エラー
📖 この問題を学べるレッスン
✏️ 手を動かして練習
📝 関連ブログ記事
- プログラミングのエラーメッセージの読み方 — エラーの読み方を基礎から解説
- JavaScriptとは?初心者向けにわかりやすく解説 — 変数・関数・イベントの基本
- JavaScriptでボタンクリックを動かす方法 — ボタンクリック時の動作を解説