Programing

document ready VS window load VS body onload

handam 2015. 3. 18. 15:11
반응형

문득 궁금해서 뒤져보다가 직접 로드되는 순서를 확인하려고 html 문서를 만들었었다.


지금도 종종 긴가민가할 때가 있다.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<body onload="fn_bodyload()">
    <div>div area</div>
</body>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
window.onload=function(){
    console.log("call type............... 0");
};
 
jQuery(document).ready(function() {
    console.log("call type............... 1");
    // if($.find('button') != null) {console.log("not null...");}
});
 
(function($){
    console.log("call type............... 3");
    // if($.find('button') != null) {console.log("not null...");}
})(jQuery);        
 
$(window).load(function() {
    console.log("call type............... 4");
    // if($.find('button') != null) {console.log("not null...");}
});
 
function fn_bodyload() {
    console.log("call type............... 5");
    // if($.find('button') != null) {console.log("not null...");}
}
 
 
$(document).ready(function() {
    console.log("call type............... 2");
    // if($.find('button') != null) {console.log("not null...");}
});
</script>
 
<!-- console.log() -->
call type....3, 1, 2, 0, 4
cs




반응형