DOM(Document Object Model)

• HTML 문서의 태그들을 JavaScript가 읽을 수 있는 객체로 표현한 모델의 모음
  • Node Tree 구조로 표현
• HTML, XML 문서의 프로그래밍 인터페이스
• DOM은 수정사항이 있을 때 처음부터 렌더링을 거치는데, 스케일이 커질수록 노드가 증가하여 브라우저의 속도가 느려질 수 있음
  • getElementById(), getElementByClassName(), getElementByTagName(), querySelector() 등을 통해 document 객체에 접근할 수 있음

BOM(Browser Object Model)

• 웹페이지 내용을 제외한 브라우저 창에 포함된 모든 요소에 접근할 수 있는 객체의 모음
• window 객체를 통해 접근 가능
• DOM은 눈에 보이는 웹문서에 대한 제어와 변경이라면, BOM은 window를 제어
  • window: 가장 최상위 객체로, 아래 서술된 모든 객체는 window의 하위 객체
  • location, document, navigator, history, screen

DOM , BOM이란 ?

[Web] DOM, 그리고 BOM이란?

[JavaScript] DOM/BOM, Web API, 이벤트 캡쳐링/버블링