14392

[code]

    <script src="a.js"></script>
    <script src="b.js"></script>
    
[/code]

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

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


CC BY-SA 3.0
2015-08-13T10:48:09.547
14382
2015-08-13T12:43:04.783
4191
question
javascript
DOMContentLoadedの発火タイミングについて


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. ](https://developer.mozilla.org/en-
US/docs/Web/Events/DOMContentLoaded)

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

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

[code]

    # 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");
    
[/code]

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

[code]

    load a.js
    load b.js
    DOMContentLoaded
    
[/code]


CC BY-SA 3.0
2015-08-13T12:43:04.783
14392
2015-08-13T12:43:04.783
7471
14382
answer