ネイティヴのJSでイベントを設定する方法

addEventListener

addEventListener(EventType, func, userCapture);

1. Eventを指定します
2. Event発火後の処理を設定します。
3. イベントフェーズを真偽値で指定します。
   ture: Captureフェーズ
   false: Targetフェーズ, Bubblingフェーズ

フェーズについては、ルートオブジェクト(HTMLの場合はDocumentオブジェクト)からターゲットオブジェクト(指定要素)に向かって階層に沿ってに読み込まれていく。

• ルートオブジェクト
  ターゲットオブジェクト に向かう段階が Captureフェーズ
  ターゲットオブジェクト に着いたところがTargetフェーズ
• ターゲットオブジェクト
  ルートオブジェクト に向かう段階が Bubblingフェーズ

となります。

フェーズの分かりやすい説明は下記のページ

addEventListener()の第３引数の意味とかをちゃんと理解する為のメモ – 今日もスミマセン。
addEventListenerの第3引数の意味 | JavaScript プログラミング解説
Qiita | DOMイベントのキャプチャ/バブリングを整理する 〜 JSおくのほそ道 #017

まぁ第三引数については、基本はFalseでいいと思います。
細かい挙動を意識しなくてはならない場合は、状況に応じて使ってみましょう。

DOMの読み込み後

document.addEventListener('DOMContentLoaded', function(e) {
    alert("Complete!!");
}, false);

ページ全体の読み込み後

window.addEventListener('load', function(e) {
    alert("Complete!!");
}, false);