티스토리 뷰
처음 배울 때 $(“document”).ready(function(){})의 의미를 정확하게 알지 못하고 관습적으로 사용했다.
문서를 읽을 준비가 되었을때 할 일 정도로만 이해하고 있다면 다시 한번 이해해보자.
1. 웹브라우저 시작
사용자가 웹페이지를 방문한다.
2.웹문서 읽기
브라우저가 웹문서를 읽기 시작한다.
3.DOM 생성
DOM이 생성되면 .ready 메서드가 실행된다.
dom이란?
문서 객체모델(DOM)
HTML 문서 객체 자체를 의미한다.
이때 문서 객체 모델에서는 모든 태그를 객체라고 부르며
그 태그에는 기능과 속성이 포함 되어있다.
예를 들어, <img>태그는 이미지를 출력하는 기능이 있고,
src,alt,width,height와 같은 속성을 포함하고 있다.
가장 상위에 위치하는 <html> 태그를 Root(뿌리)라고 부르며 나머지는 Node(나무 줄기 가지)로 부른다. (연결망의) 교점[접속점]으로도 불린다.
노드의 종류에는 Element Node(요소 노드), Text Node(텍스트 노드), Attribute Node(속성 노드)가 있다.
4.요소들 로딩
이미지를 포함한 요소들이 로딩되기 시작합니다.
5.페이지 로딩 완료
모든 요소들이 로딩되면 .load 메서드가 실행된다.
.ready 메서드와 .load의 실행시점을 이해할 수 있었다.
댓글