🐡
【JavaScript】defer属性（メモ）
スクール時代からあまり触れてこなかったJavaScript。
基本的なことから学び吸収するための個人メモです。
defer属性とは
defer属性はHTMLの<script>タグに使用され、スクリプトの実行をページの読み込みと表示が完了した後に遅らせることができる属性です。
簡単にいうと1つの処理の終了を待たずに次の処理を行う非同期化で、Webページの読み込みを速くすることができます。
defer属性の仕組み
<head>タグ内でJavaScriptファイルを読み込ませる場合
通常の流れとしては、HTMLのコードを上から下へ順番に解析する中で、<script>タグがあると、一度HTMLの解析は停止され、JavaScriptの読み込みと実行が行われます。
JavaScriptが実行された後、残りのHTMLの解析が続けられます。
<head>タグ内でdeferをつけてJavaScriptファイルを読み込ませる場合
<script>タグにdefer属性を指定することで、HTMLの解析が中断されることなく、同時にJavaScriptの読み込みが行われます。
そして、HTMLの解析が終了した後に、読込んだJavaScriptが実行されます。
書き方
下記のように、HTMLファイルの<head>タグにある<script>タグ内の読込みファイル名の後ろにdefer属性を記述してあげます。
HTMLファイル
：
<head>
：
<script src="js/script.js" defer></script>
：
</head>
:
参考
1冊ですべて身につくJavaScript入門講座
Discussion