load 이벤트와의 차이점

ready() 메소드는 웹 페이지의 DOM이 생성이 되면 등록된 함수를 실행하는 반면, load 이벤트는 웹페이지를 구성하는 모든 요소들의 로드가 완료되면 등록된 함수를 실행한다. 사실 어찌보면 이 두 개의 시점은 동일하지 않나 생각할 수도 있겠다. 하지만 <img> 태그에 의해서 이미지를 생성하는 단계를 생각해 보면 분명 차이가 있다. <img> 태그는 실행시 HTMLImageElement로 처리되어지지만 실제로 보여지는 이미지는 서버에게 요청하는 절차를 거쳐서 최종적으로 화면에 보여진다. 즉 DOM이 만들어지는 것과 해당 리소스를 서버에서 가져와 처리후 보여지는 시간의 차이는 발생한다.

정리한다면 ready() 메소드는 DOM이 생성된 직후에, load 이벤트는 웹 페이지의 모든 리소스가 완전하게 로드가 된 직후에 발생하며 이 둘은 분명히 시차를 가지고 있다.