728x90
사용자가 브라우저에서 HTML문서를 요청하여 HTML문서의 로딩이 완료되면 이벤트 핸들러를 실행한다.
* 예제
| <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title> 이벤트 </title> <script src="js/jquery.js"></script> <script> $(function( ) { $(document).ready(function(){ //HTML에 전체요소가 로딩되면 이벤트 핸들러가 실행된다. var h1 = $(".img1").height(); console.log("ready :", h1); //ready : 0 }); $(window).load(function(){ //외부 소스(이미지)가 완전히 로딩되면 이벤트 핸들러가 실행되며 이미지 높잇값(300)이 출력된다. var h2 = $(".img1").height(); console.log("load :", h2); //load:300 }); }); </script> </head> <body> <p> <img src="http://place-hold.it/300X300" class="img1"> </p> </body> </html> |
'내마음대로만들어보자 > JS' 카테고리의 다른 글
| 클릭 이벤트 차단하기 - preventDefault() (0) | 2021.08.22 |
|---|---|
| 마우스 이벤트 - click() / dbclick() 메서드 (0) | 2021.08.22 |
| 이벤트 제거 - off() (0) | 2021.08.22 |
| 강제로 이벤트 발생시키기 - trigger() 메서드 (0) | 2021.08.22 |
| 그룹 이벤트 등록 메서드 - click() / on() (0) | 2021.08.22 |