jQuery에서 $(document).ready() 에 관하여.

이전의 포스팅을 통해 $(document).ready()는 페이지상의 DOM 객체를 모두 로딩하여 사용가능한 상태로 준비가 되면 호출된다고 하였다. 

2013/08/30 - [웹/모바일 개발/jQuery] - jQuery에서 $(document).ready()가 갖는 의미

기능상 onload  이벤트 핸들러와 비슷한 듯 하지만 한 페이지에 내에서 동영상이나 이미지와 같은 리소스를 얼마나 많이 로딩하여 사용하느냐에 따라 미묘한 차이가 발생한다. 가령 많은 이미지를 가져와 보여주어야 하는 갤러리 페이지를 구현해야 할 경우 onload 이벤트 핸들러를 사용한다면 사용자는 모든 이미지가 로딩될 때 까지 무한정 기다려야만 한다. 그러나  $(document).ready() 구문으로 바꾸어 사용한다면 그러한 문제를 회피할 수 있다. 

본론으로 돌아와... 

 $(document).ready()는 말그대로 도큐먼트(document) DOM 앨리먼트의 jQuery  객체에 대한 ready() 메소드를 호출한다는 의미이다. 

$(document).ready(function() {
   // DOM이 로드되었을 때 실행되어야 하는 코드
});

동일하지만 위의 코드를 다음과 같이 줄여쓸 수도 있다. 

$(function() {
   // DOM이 로드되었을 때 실행되어야 하는 코드
});

위이 두 코드는 동일한 의미이지만 줄여쓰기 보다는 일반적으로 의미가 명확하기 때문에 $(document).ready() 구문을 선호하여 쓴다.