async/defer 属性と DOM 構築

3. script with async

実行結果

Hello World!

マークアップ

<p id="result">
    Hello
    <script src="A.js" async defer></script>
    <script src="B.js" async defer></script>
    <script src="C.js" async defer></script>
    World!
</p>

DOM 要素とイベント

解説

async 属性をサポートしたブラウザでは、スクリプトの読み込みにより DOM 構築とレンダリングがブロックされることはなく、またその読み込みが完了し次第、非同期に実行されます。ただしスクリプトの実行順序は保存されないため、依存関係のあるスクリプトには指定することができません。