[jQuery] Document.ready , onload 실행 순서
- 📕 Programing/jQuery
- 2020. 5. 11. 17:45
- ready() : 사용자가 사이트를 방문할 때 요청한 HTML 문서 객체(document)의 로딩이 끝나면 이벤트를 발생시킨다.
- load() : 외부에 연동된 (iframe, img, video)의 로딩이 끝나면 이벤트를 발생시킨다.
<!doctype html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>HTML5 Document type</title>
</head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
alert('A');
$(document).ready(function(){
alert('jquery Ready==');
});
$(function(){
alert('BB');
});
window.onload = function(){
alert('onload');
};
alert('c');
</script>
<body>
<h1>
hello script
</h1>
<form id=reset_test_form>
메일주소 <input type="text" id ="mail" value="aaaa" /><br>
전화번호 <input type="text" id="tel"/>
</form>
<input type="button" id="btn_reset" value=" Reset "></button>
</body>
</html>
실행을 해보면 A - > C -> onload -> DOM로딩 -> jquery -> BB 순서로 출력이 된다.
즉, $(document).ready 는 태그 등 로딩이 완료되었을 시점에 이벤트를 발생 시킨다.
'📕 Programing > jQuery' 카테고리의 다른 글
| [jQuery] 해당 요소의 상위요소 탐색 (0) | 2021.10.13 |
|---|---|
| [jQuery] 테이블의 선택한 열 값 가져오는 방법 (0) | 2021.08.24 |
| [jQuery] selecbox option값 자동 체크 (0) | 2020.05.25 |
| $.ajax 을 활용한 JSON 파싱 (0) | 2020.05.13 |
| [jQuery] $.getJSON 으로 JSON 출력하기 (0) | 2020.05.12 |