エンジニアのひよこ_level10

【毎日更新!】新卒2年目エンジニアブログです! プログラムだけじゃなく、マネジメントとかも書いていきたい!

【HTML・JS】defer。書き順関係なく、HTMLの後にJSファイルを読み込む【227日目】

いつ使うの

HTMLファイルの中でscriptタグでJSファイルを読み込むときで、

・必ず読み込んでほしいとき
・HTMLを描画終わった後にJSファイルを読み込んでほしいとき

何書くの

<script src="https://xxxxxx.jp/yyyyy.js" defer>

scriptタグの最後にdeferを書く

何が起きてるの

通常:HTML読み込んでscriptタグがあったときは、JSファイル読み込みまでHTMLタグ読み込み止まる
async:HTMLとJSが並行して読み込む
defer:HTML読み込み完了→JSファイル読み込み

ブラウザシェア

だいたい使える

Can I use... Support tables for HTML5, CSS3, etc