Javascriptの記述方法（HTML内埋め込みと外部読込み） [Javascript] All About

Javascriptの記述方法は2つ。
HTML内埋め込みと外部読込みがある

誰でも手軽に始められるのがJavascriptのいいところだ

さて、前回試したコードはHTML内のボタン要素に直接書き込みました。

JavaScriptを書く場所は、大きく分けてHTMLファイルに書く方法と、JavaScriptファイル内に書く方法の2通りがあり、さらに、それぞれに2つの方法があります。まとめて見ましょう

HTMLファイル内に書く
- <script>要素に書く
- HTML要素に書く　←これが前回の書き方
HTMLファイルの外部から読込む
- <script>要素のsrc属性による読み込み
- XHRなどによる読み込み

前回、ボタン要素<button>の中に書いたコードはHTMLファイル内でHTML要素(つまり、この場合はボタン要素)の中に書くタイプのものだったということになります。

HTML内埋め込みと外部読込み、どちらがいいの？

HTMLファイルの中に書く方法は、手軽で、HTMLもJavaScriptも一度に眺められますから見通しも良く、1ページだけ書くなら便利な方法です。したがって、JavaScriptを最初に学ぶときにも全体が把握しやすいのでおすすめな方法と言えます。

しかし複数ページで、長期間のメンテナンスなどを考慮して作成する時(実際のサイト構築時)などには、JavaScriptやCSSなどは、別のファイルとして作成し、HTMLファイルへ必要なときに読み込んで使うよう方が管理上好ましい場合が多くなります。

それでは次回からそれぞれについて説明していきます。

1.　HTMLファイル内に書く
2.　HTMLファイル外部から読込む

※記事内容は執筆時点のものです。最新の内容をご確認ください。

※OSやアプリ、ソフトのバージョンによっては画面表示、操作方法が異なる可能性があります。