JQuery 에서$.Ready()에 대한 분석

2491 단어 JQuery$.Ready
$(document).Ready()방법 VS OnLoad 이벤트 VS$(window).load()방법 으로 JQuery 를 접 하 는 방법 은 일반적으로 언제 이 벤트 를 시작 하 는 지 가장 먼저 배 웁 니 다.오 랜 시간 동안 페이지 에 불 러 온 후에 발생 한 사건 들 은 모두"Body"의 Onload 사건 에 불 러 옵 니 다.Body 의 Onload 사건 은 JQuery 의 Ready 방법 에 비해 많은 단점 이 있 습 니 다.예 를 들 어 1.여러 함 수 를 불 러 오 는 문제 Onload 이벤트 에서 이렇게 만 불 러 옵 니 다.추 합 니 다......................................................................3.실행 순서 가 다른 Body.Onload 이벤트 에 대해 서 는 모든 페이지 의 내용 을 불 러 와 야 실행 합 니 다.그림,flash 등 을 포함 한 모든 내용 을 말 합 니 다.페이지 의 내용 이 많 으 면 사용자 가 오래 기다 릴 수 있 습 니 다.$(document).ready()방법 에 대해 서 는 페이지 의 모든 DOM 을 불 러 온 후에 만 실 행 됩 니 다.의심 할 여지없이 웹 페이지 의 속 도 를 크게 가속 화 시 켰 다.그러나 일부 특수 응용,예 를 들 어 그림 의 확대 축소,그림 의 가위질 등 이다.웹 페이지 의 모든 내용 을 불 러 오고 실행 해 야 합 니까?$(window).load()방법 을 추천 합 니 다.이 방법 은 페이지 의 모든 내용 을 불 러 온 후에 야 실 행 됩 니 다.또한 OnLoad 이벤트 의 단점 도 없습니다
 
<script type="text/javascript">
$(window).load(function() {
alert("hello");
});
$(window).load(function() {
alert("hello again");
});
</script>
위의 코드 는 페이지 의 모든 내용 을 불 러 온 후에 선착순 으로 실 행 됩 니 다.물론 이에 대응 하 는 Unload 방법 을 잊 지 마 세 요
 
$(window).unload(function() {
alert("good bye");
});
위의 코드 는 페이지 가 닫 힐 때 발생 합 니 다.모든 DOM 이 불 러 오기 전에 JS 코드 를 일 으 키 는 방법 은 제 가 디 버 깅 할 때 가장 좋아 하 는 것 입 니 다.가끔 개발 할 때 도 이런 방법 을 사용 합 니 다
 
<body>
<script type="text/javascript">
(function() {
alert("hi");
})(jQuery)
</script>
</body>
네,js 패 킷 을 닫 는 형식 으로 js 코드 를 body 에 끼 워 넣 는 것 입 니 다.이 코드 는 자동 으로 실 행 됩 니 다.물론 js 코드 를 직접 끼 워 넣 을 수도 있 습 니 다.이런 방식 은 순서 문 제 를 주의해 야 합 니 다.다음 과 같 습 니 다
 
<body>
<div id="test">this is the content</div>
<script type="text/javascript">

alert($("#test").html());//I Can display the content

</script>
</body>
<body>

<script type="text/javascript">

alert($("#test").html());//I Can't display the content

</script>
<div id="test">this is the content</div>
</body>
위의 두 번 째 코드 중에서 현재 코드 이전의 DOM 만 설명 할 수 있 기 때 문 입 니 다.테스트 는 해 석 된 DOM 수 에 존재 하지 않 습 니 다.따라서 두 번 째 코드 는 정확하게 표시 할 수 없습니다.

좋은 웹페이지 즐겨찾기