$(function() / $(document).ready(function() / (function($)

자바스크립 코딩에 있어 아래와 같은 이벤트 핸들러에는

페이지가 로딩되었을때 일어날길 바라는 이벤트들이 작성된다.

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

2.  (function(){ ... });

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

4.  (function($) {

       // 실행코드

    })(jQuery);     

  

1, 2번 항목의 경우에는 

웹 페이지의 로딩이 완료한 다음 안에 쓰여진 코드를 실행하라는 의미인데, 하지만 리소스와 상관없이 DOM만 생성되어도 호출이 가능하다. 즉, 이미지와 같은 리소스를 요구하는 페이지일 경우 이미지의 로딩완료와 상관없이 진행된다. (2번의 경우 1번의 생략형이다.)

3.번 항목의 경우에는 현재 호출 되고 있는 페이지에서 DOM뿐만아니라 리소스 호출도 완료되었을 경우에 실행된다.

4.번 항목의 경우 '$'를 jQuery에서 쓰겠다는 명시. 즉 다른 js에서도 $를 사용하으로 충돌되는 것을 방지함

항상 사용하는 것이지만, 확신이 없어서 다시 정리함.

[출처] [중요] onload와 (function(){...}, $(document).ready(function){ ... }; 의 차이|작성자 똥광이