質問: 2つのjsファイルの読み込みの完了を待って、次のjsの処理がしたいと考えています。 1つの場合はonloadイベントで行けたのですが、2つだとどう記述していいのか迷います。
回答: Javascript は、 基本的に記述された順序で読み込んで実行してい組んで、 ━━━━━━━━━━━━━━━━ ━━━━━━━━━━━━━━━━ のように順番に記述するだけで、 「次の Javascript コード」が実行される時点で 2つの JS は読み込みが完了しているけど。。。 何がしたいのか。 ひょっとして、 2つの JS ファイルに、 ページ読み込み完了後に実行する処理を ━━━━━━━━━━━━━━━━ window.onload = function(){ ~ 処理 ~ } ━━━━━━━━━━━━━━━━ のように書いているってことか? それで、 2つの JS ファイルに記述された「ページ読み込み後」の処理を、 両方とも実行したい、そういうことだろうか? 「window.onload = function(){~}」で書くと、 最初に指定した「window.onload」は、 あとに指定した「window.onload」の内容で上書きされてしまうんで、 "load" イベントに関数を指定する場合は、 addEventListener() を使用して指定する。 ━━━━━━━━━━━━━━━━ 【 script1.js 】 window.addEventListener( "load", function(){ ~ 処理 ~ }, false ); 【 script2.js 】 window.addEventListener( "load", function(){ ~ 処理 ~ }, false ); 【 HTML 】 ━━━━━━━━━━━━━━━━ 画像など読み込みも含める場合は "load" イベントでもいいけど、 単純にページの構成が読み込み終わった時点で実行するなら、 "DOMContentLoaded" の方がいい。 ━━━━━━━━━━━━━━━━ 【 script1.js 】 window.addEventListener( "DOMContentLoaded", function(){ ~ 処理 ~ }, false ); 【 script2.js 】 window.addEventListener( "DOMContentLoaded", function(){ ~ 処理 ~ }, false ); 【 HTML 】 ━━━━━━━━━━━━━━━━