2
<script src="a.js"></script>
<script src="b.js"></script>

a.js内でDOMContentLoadedを登録した場合、
b.js(a.jsより後に書いたscriptタグ)の読み込みを待って発火するのでしょうか?
それとも待たずに発火するのでしょうか?

http://nazomikan.hateblo.jp/entry/2014/02/02/183314
上記サイトより、cssは読み込みを待たずに発火するみたいなのですが
scriptタグの場合はどうなりますか。

1 件の回答 1

2

javascript は全て読み込まれ、解析されてから、発動すると思います。

参考にされたサイトの元を見てみると下記のように書かれています。

The DOMContentLoaded event is fired when the initial HTML document has been completely loaded and parsed, without waiting for stylesheets, images, and subframes to finish loading. 

対象ではないのは、「スタイルシート、画像、サブフレームの読み込み」なので、
javascript は解析されてから発火すると考えられます。

ちょっと不安だったので、検証してみました。

# test.html
<script src="a.js"></script>
<script src="b.js"></script>

# a.js
window.addEventListener("DOMContentLoaded", function(){
  console.log("DOMContentLoaded");
});
console.log("load a.js");

# b.js
console.log("load b.js");

結果は下記なので、DOMContentLoaded は、全ての js が読み込まれてから、発火すると考えます。

load a.js
load b.js
DOMContentLoaded

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。