DOM 이란

1. 설명

wiki : Document Object Model의 약자로, XML 또는 HTML 같은 문서들을 tree 구조로 다루는 cross-platform 또는 independent interface이다. tree의 각 노드들은 문서의 부분을 나타내는 객체이다.

MDN : 웹페이지와 스크립트나 프로그래밍언어를 문서 구조에 의해 연결하는 역할을 한다. 예를들어 HTML을 웹브라우저에 나타낸다. DOM은 문서를 트리 구조로 타나내는데, 트리의 각 노드는 object를 포함하고, DOM method로 프로그래밍적으로 tree에 접근할 수 있다. 노드들은 또한 이벤트 핸들러를 가질 수 있고, 이벤트가 발생하면 핸들러가 실행된다.

2. 사용법

밑의 예제 코드를 보면, standard Dom은 getElementsByTagName을 사용하여 <p> element를 모두 가져올 수 있다. 밑의 코드를 보면 코드는 javascript로 쓰여져있고, Document와 elements에 접그낳기 위해서 DOM을 사용하는 것이다. 페이지의 content들은 DOM에 저장되고, javascript를 사용해서 접근이 된다.

const paragraphs = document.getElementsByTagName("p");
// paragraphs[0] is the first <p> element
// paragraphs[1] is the second <p> element, etc.
alert(paragraphs[0].nodeName);