1. 실행 시간
window.onload는 실행되기 전에 이미지를 포함한 페이지의 모든 요소가 로드될 때까지 기다려야 합니다.
$(document).ready()는 DOM 구조가 그려진 후 로드될 때까지 기다리지 않고 실행됩니다.
2. 쓰기 횟수가 다릅니다
Window.onload는 동시에 여러 개를 쓸 수 없습니다. Window.Onload 메서드가 여러 개인 경우
하나만 작성하세요.
$(document).ready() 는 동시에 여러 번 작성할 수 있으며 모두 실행 가능합니다
3. 단순화된 글쓰기
window.onload에 대한 간단한 작성 방법이 없습니다
$(document).ready(function(){})는 $(function(){});
이전 개발에서는 주로 JavaScript를 사용했고 항상 jquery 모드를 사용했습니다. 즉, 대부분의 경우 첫 번째 줄은 다음과 같습니다.
현재 일부 메서드를 실행하기 전에 모든 js와 이미지가 로드될 때까지 기다릴 필요는 없지만 때로는 모든 js와 이미지가 로드될 때까지 기다려야 할 때도 있습니다.
모든 요소가 로드되면 일부 메소드가 실행될 수 있습니다. 예를 들어, 일부 사진이나 기타 측면은 이때 일부 버튼을 클릭하면 예상치 못한 상황이 발생할 수 있습니다.
body.onload()
대신 $(window).load(function(){...})를 사용하는 몇 가지 이유
우선, 페이지의 모든 요소(html 태그 및 모든 참조 이미지, 플래시 및 기타 미디어 포함)가 로드된 후에 실행됩니다.
여러 함수를 동시에 로드하고 싶다면 이렇게 작성해야 합니다
$(window).load()를 사용하면 이와 같은 여러 함수를 로드할 수 있습니다
body.Onload()를 사용하지 않는 이유 2:
body.Onload()를 사용하면 js와 html을 완전히 분리할 수 없습니다. 이는 매우 심각한 문제입니다.
또한 $(window).load(function(){...}) 및 body.onload()를 사용하면 동일한 문제가 발생합니다. 왜냐하면 처음에 언급했듯이 둘 다 모든 콘텐츠가 끝날 때까지 기다려야 하기 때문입니다. 페이지 중
을 사용할 수 있습니다.
로딩이 완료된 후 실행되지만 네트워크 속도가 상대적으로 느린 경우 페이지를 로드하는 데 시간이 오래 걸리는 경우가 많습니다(몇 초에서 10초 이상 또는 그 이상...). 그래서 우리는 종종페이지가 완전히 로드되지 않은 상태에서 사용자가 이미 페이지를 운영하고 있는 상황이 발생하게 되어 페이지 효과가 예상과 다를 수 있습니다.
여기서 $(document).ready(function(){}) 또는 약어로 $(function(){})을 사용하는 것이 좋습니다. 페이지의 DOM 요소가 로드된 후에 실행되기 때문입니다.
이미지나 기타 미디어가 다운로드될 때까지 기다릴 필요가 없습니다.
그러나 때로는 실행하려는 함수를 실행하기 전에 페이지의 모든 내용이 로드될 때까지 기다려야 하므로 $(window).load(function(){...}) 또는
을 사용해야 합니다.
$(function(){})을 사용하려면 특정 요구 사항에 따라 다른 선택이 필요한 경우가 많습니다.마지막으로 모든 DOM 요소가 로드되기 전에 실행되는 jQuery 코드 조각을 첨부합니다
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
