$(document).ready()

$(document).ready()

<script>
	$(document).ready() {
    
    };
</script>

jQuery를 사용한 모든 웹 페이지는 위와 같은 코드로 시작된다.

$(document).ready()는 문서가 준비되면 매개변수로 넣은 콜백 함수를 실행하라는 의미이다.

 

window 객체의 load 이벤트 연결

<script>
	window.onload = function() {
    
    };
</script>

고전 이벤트 모델은 한 번에 하나의 이벤트만 연결할 수 있다. 반면에 jQuery의 이벤트 메서드는 표준 이벤트 모델이나 인터넷 익스플로러 이벤트 모델과 마찬가지로 이벤트로 여러 개의 함수를 연결할 수 있다.

 

복수의 이벤트 연결

<script>
	$(document).ready(function() {
    	alert('First READY');
    });
    
    $(document).ready(function() {
    	alert('Second READY');
    });
    
    $(document).ready(function() {
    	alert('Third READY');
    });
</script>

위 코드를 실행하면 문서가 준비되는 순간 경고창 세 개가 연달아 표시된다.

 

간단한 형식의 $(document).ready()

<script>
	$(function() {
    
    });
</script>

$(document)ready() 메서드는 많이 사용되므로 위와 같이 간단하게 사용할 수 있는 형태를 제공한다.

 

:: ) 자바스크립트에서 식별자로 사용할 수 있는 특수 기호는 $와 _이다. 여기서 $를 식별자로 사용했을 뿐이다.

ex ) window.jQuery = window.$ = jQuery;

jQuery 식별자를 $로 대체했을 뿐이다. 따라서 $ 식별자가 아니라 jQuery 식별자를 사용해도 된다.