ひっそりボチボチやります

HTMLページにJavaScriptのコードを組み込む

JavaScriptのコードをHTMLページに組み込むには、<script>要素を利用する。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>タイトル</title>
</head>
<body>
・・・ページ本文・・・
<script type="text/javascript">
console.log('Hoge');
</script>
</body>
</html>

type属性は、スクリプトの種類を表す。ただし、HTML5でのデフォルト値は「text/javascript」なので、省略可。

「メモ」
language属性
昔のコードでは「language="JavaScript"」のような指定をしているものもあるが、現在は非推奨の扱いとなっている。古いブラウザとの互換性のために、language属性とtype属性を併記するようなケースもあるが、現存するブラウザのほとんどはtype属性に対応しているので、あえてそのようにする意味はない。

<script>要素そのものは、<body>閉じタグの直前に記述するとGood。一般的なブラウザではスクリプトの読み込み＆実行が完了するまで、以降の描画をブロックする。そのため、巨大なスクリプトがページの最初（たとえば<head>要素の配下）にあることは、そのまま描画速度が劣化する一因ともなる。 <body>閉じタグの直前に<script>要素を記述することで、そのような遅延を解消できる。一般的に、JavaScriptによる処理はページの読み込みを完了してから行うため、末尾に記述することによる弊害もない（特殊な例外がある場合も、そのコードだけをページの先頭に記述するようにすると良い）。