!DOCTYPE html은 HTML웹 표준 선언문이다.

문서객체모델(Document Model =DOM) ★★★★★★★

웹에서 자바스크립트를 사용하는 이유는 어떤 조건에 맞거나 사용자의 동작이있을때
웹 문서전체 또는 일부분이 동적으로 반응하게 만들기 위해서이다.
이렇게 반응하게 하려면 웹 문서의 모든 요소를 따로 제어할 수 있어야 한다.

예를 들어 웹 문서에 텍스트와 이미지가 들어 있다면 웹 브라우저는 마크업 정보를 보면서
텍스트 단락이 몇개고, 내용이 무엇인지 살펴본 후 저장한다.
또 이미지가 몇개고, 이미지 파일 경로는 어디고, 대체 텍스트는 무엇인지도 파악해서
이미지 별로 다 정리해서 인식한다.
이런 텍스트나 이미지요소를 브라우저가 제어하려면 두 요소를 따로 구별하여 인식하여야한다.
이러한 모든 정보 요소를 자바스크립트로 가져와서 프로그래밍할때 DOM을 이용한다.

즉, 문서객체 모델을 한마디로 정의하면
: 자바스크립트를 이용하여 웹문서에 접근하고 제어할 수 있도록 객체를 사용해 웹 문서를
체계적으로 관리하는 방법.
을 말한다.

HTML문서로 작성한 웹 문서의 DOM능 HTML DOM이라고 부르고 XML문서에서 사용하는 XML DOM도 있다.

DOM은 웹문서를 하나의 객체로 정의한다. 그리고 웹문서를 이루는 이미지나 텍스트, 표 등의
모든 요소도 각각 객체로 정의한다. 웹 문서 전체는 document객체이고, 이미지는 image객체이다.
즉, 웹문서 안의 모든 태그는 객체로 인식하고 처리한다.

    -----------------------------------------------
    
    

DOM트리

자바스크립트로 DOM을 조작하려면 실제 웹 문서가 DOM으로 어떻게 표현되는지
알아야한다. DOM은 웹 문서의 요소를 부모요소와 자식요소로 구분한다.
예를들어 HTML최상위 객체 안에는 HEAD와 BODY라는 자식요소가 있고,
HEAD안에는 HITLE,MATA,LINK와 같은 자식요소를 포함한다.
BODY안에는 DIV,HEADER,MAIM,FOOTER와 같은 자식요소를 포함한다.
이 모습을 도표로 그려보면 마치 나무뿌리와 닮았다고 하여 DOM TREE라고 부른다.
DOM트리의 최상위 객체는 자바스크립트에서 document라고 표현한다.
또한 태그요소는 여러 속성들이 들어간다.
태그요소 안에 들어있는 속성들도 자식으로 나타낸다.

자식이다.