[Javascript] 문서로딩 완료 코드 실행 되는 순서

//자바스크립트 문서로딩 완료 실행 되는 순서(js 실행순서)

 

 

document.addEventListener('readystatechange', (event) => {

    console.log('readystatechange-1');//1 - 주의! 중복 실행됨 => 쓰면 안됨

});

//추천 - 동기로 실행됨(비동기 아님)

document.addEventListener('DOMContentLoaded', (event) => {

    console.log('DOMContentLoaded-2');//2

});

 

//----------------------------------

// jQuery가 먼저 로드 되야 함

$(function(){

    console.log('jq - function');//3

});

 

$( document ).ready(function() {

    console.log('jq - ready');//3

});

//----------------------------------

// 주의! 여러개가 있으면 마지막만 실행됨

window.onload = (event) => {

    console.log('window.onload', event);//5

};

 

// 여러개 있어도 모두 실행됨 (맨 나중 실행)

window.addEventListener('load', (event) => {

    console.log('window.addEventListener load');//5

});