JQ 에서$(window).load 와$(document).ready 차이 와 실행 순서

JQ 의$(document).ready()는 여러분 이 사용 해 야 할 것 이 매우 많 습 니 다.기본적으로 모든 JS 스 크 립 트 에 이 함수 가 나타 날 때 도 있 고 심지어 여러 개가 나타 날 때 도 있 습 니 다.그러면 다른 로 딩 함수$(window).load 가 상대 적 으로 나타 나 는 횟수 가 적 습 니 다.다음은 이들 의 실행 순서 와 차이 점 을 소개 합 니 다.
일반적인 상황 에서 다음 페이지 가 불 러 오 는 기본 순 서 는 도 메 인 이름 해석->html 불 러 오기->js 와 css 불 러 오기->그림 불 러 오기 등 다른 정보 입 니 다.
그러면 JS 스 크 립 트 를 작성 할 때 어떤 상황 에서$(document).ready()를 사용 하고 어떤 상황 에서$(window).load 를 사용 하 는 지 알 아 보 겠 습 니 다.두 가지 기능 을 알 아 보 겠 습 니 다.
1.$(document).ready()
글자 그대로 문서 가 준비 되 었 다 는 뜻 이다.즉,브 라 우 저 는 html 문 서 를 불 러 오고 해석 하 였 습 니 다.dom 트 리 는 이미 만들어 진 다음 에 이 함 수 를 실행 합 니 다.
네 이 티 브 자바 스 크 립 트 의 작성 방법 은 다음 과 같 습 니 다.

document.ready=function(){
 alert("ready"); 
}

jQuery 의 작성 방법 은 다음 과 같 습 니 다.

$(document).ready(function(){
 alert("ready");
});

혹시

$(function(){
 alert("ready");
});

2.$(window).load
웹 페이지 의 모든 요소(페이지 의 그림,css 파일 등 모든 관련 파일 포함)를 브 라 우 저 에 완전히 불 러 와 서 실행 합 니 다.
네 이 티 브 자바 스 크 립 트 의 작성 방법 은 다음 과 같 습 니 다.

window.onload = function(){ 
 alert("onload"); 
};

jQuery 의 작성 방법 은 다음 과 같 습 니 다.

$(window).load(function(){
 alert("onload");
});

둘 의 차 이 는:
1.실행 시간 이 다르다
$(document).ready()는 페이지 에서 HTML 로 딩 을 완료 하고 DOM 트 리 를 만 든 후에 실행 되 지만 페이지 를 대표 하 는 것 은 아 닙 니 다.
데이터 가 모두 불 러 왔 습 니 다.일부 큰 그림 은 DOM 트 리 를 만 든 후 오 랜 시간 이 지나 야 불 러 올 수 있 습 니 다.
$(window).load()는 그림 등 관련 파일 을 포함 하여 전체 페이지 가 불 러 온 후에 실 행 됩 니 다.
2.실행 할 수 있 는 횟수 가 다르다
$(document).ready()는 자바 스 크 립 트 코드 에 여러 번 나타 날 수 있 으 며,함수 나 코드 를 실행 할 수 있 습 니 다.$(window).load()는 자바 스 크 립 트 코드 에 한 번 만 나타 날 수 있 습 니 다.$(window).load()가 여러 개 있 으 면 마지막$(window).load()의 함수 나 코드 만 실 행 됩 니 다.이전$(window).load()는 덮어 씁 니 다.
3.집행 의 효율 이 다르다
dom 의 요소 노드 에 onclick 속성 노드 를 추가 하려 면$(document).ready()를 사용 하면$(window).load()를 사용 하 는 것 보다 효율 이 높 습 니 다.하지만 때로는$(window).load()를 사용 해 야 합 니 다.
요약 하면$(window).load()는$(document).ready 이후 에 실 행 됩 니 다.또한 페이지 의 모든 내용 을 불 러 온 후에 실 행 됩 니 다.이들 의 사용 시 기 는 한눈 에 알 수 있 습 니 다.여러분 이 스스로 결정 할 수 있 습 니 다.