먼저 jQuery에 대해 설명하겠습니다. jQuery에는 Javascript를 DOM으로 빠르게 로드할 수 있는 편리한 작은 기능이 있습니다. 즉, 이미 준비가 되어 있습니다... 페이지가 로드되기 전에 실행됩니다.
window.onload()를 사용하면 안 되는 이유는 window.onload 함수가 실행될 때 이미지, 배너 등을 포함한 모든 것이 로드되었음을 나타내야 하기 때문입니다. 큰 이미지의 다운로드 속도는 느려지므로 사용자는 기다리는 데 오랜 시간이 걸리는 window.onload() 실행의 코드 효과를 보려면 큰 이미지가 다운로드될 때까지 기다려야 합니다. 우리가 원하는 것이 아닙니다.
그러나 $(document).ready(fn): DOM이 로드되고 쿼리 및 조작 준비가 되었을 때 실행될 함수를 바인딩합니다.
웹 애플리케이션의 응답 속도를 크게 향상시킬 수 있기 때문에 이벤트 모듈에서 가장 중요한 기능입니다.
간단히 말하면 이 방법은 window.load 이벤트로 이벤트를 등록하는 것에 대한 대안일 뿐입니다. 이 방법을 사용하면 DOM이 로드되어 읽고 조작할 준비가 되자마자 바인딩한 함수를 호출할 수 있습니다. $(document).ready(function(){ // 코드 });
$(document)는 전체 웹 문서 개체를 가져오는 것을 의미합니다(window.document와 유사).
$(document).ready는 문서 객체가 준비되면 가져오는 것을 의미합니다. 위 코드의 의미는 문서 객체의 동작이 허용될 때까지 검사한다는 것입니다. (번역자 주: 문서 객체가 로드되어 있는 동안만 코드를 실행할 수 있기 때문에 window.onload() 함수보다 훨씬 빠릅니다. , 페이지의 이미지 다운로드가 완료되었는지 확인하기 위해 기다려야 하는 대신) --- 이것이 우리가 원하는 것입니다.