들어가기에 앞서
하단의 참고한 자료를 바탕으로 개인의 생각을 정리한 글이므로 오류가 있을 수 있습니다.
오류에 대한 피드백은 언제든지 환영합니다. 부디 댓글로 알려주시길 바랍니다. 감사합니다.
Document Object Model
XML, HTML같은 마크업 언어로 작성된 문서를 Javascript나 Python 과 같은 프로그래밍언어로 조작이 가능하게 해주는 인터페이스.
DOM은 프로그래밍 언어와 독립적이며, 계층적인 노드 트리 구조를 가지고 있다.
왜 DOM이 필요한가
Javascript는 그 자체로는 웹페이지를 동적으로 만들 수 없다. 마크업 언어에는 요소에 접근 가능한 인터페이스가 없기 때문이다. Web API인 DOM이 Javascript와 마크업 언어의 중간 다리 역할을 하여 마크업 언어의 요소를 제어를 가능하게 함으로써 웹페이지를 동적으로 작동하게 해준다.
왜 DOM은 계층적인 구조인가
명확한 계층구조로 인해 특정 노드에 대해 접근,추가,수정,삭제가 간편하며 각 노드들의 부모 자식 관계, 형제 관계를 빠르게 파악할 수 있어 편리하다.
또한, 하위 요소에서 발생한 이벤트가 상위 요소로 전파되는 이벤트 버블링, 반대로 상위 요소에서 발생한 이벤트가 하위 요소로 전파되는 이벤트 캡처링이 계층적인 구조에서 유리하기 때문이다.
