본문 바로가기
Develop/Javascript

Javascript & jQuery 페이지 로드 후 이벤트 실행하는 방법들의 차이점

by bellsilver7 2020. 2. 23.
728x90

안녕하세요. 은은한 개발자입니다.
 

// 1번
$(document).ready(function(){});

// 2번
$(function(){});

// 3번
window.onload = function(){};

Javascript jQuery 를 사용하다보면 페이지가 로딩 되었을 때 이벤트를 사용하기 위해 위와 같은 이벤트 핸들러를 작성한 것을 보거나 사용하게 된다.
 
이 3가지 경우의 차이점은 아래와 같다.
 

// 1번
$(document).ready(function(){});

// 2번
$(function(){});

1번2번의 경우 jQuery 에서 사용하는 방식이고, 소스와 상관없이 DOM만 생성되어도 호출이 된다.
즉. 이미지와 같은 리소스를 요구하는 페이지일 경우 이미지의 로딩의 완료에 상관없이 진행된다.
 
 

// 3번
window.onload = function(){};

그러나 3번 같은 경우엔 DOM레벨 0방식의 Javascript현재 호출 되고 있는 페이지에서 DOM뿐만 아니라 리소스 호출까지 완료 되었을 경우 실행된다.

728x90

댓글