DOM

DOM은 HTML을 JavaScript가 찾을 수 있는 객체 트리로 바꾼다

브라우저는 문서를 읽어 document에서 시작하는 트리를 만들고, JavaScript는 그 노드를 찾아 내용과 스타일을 바꿉니다.

document

html

html

headbody

body

h1 제목p 문단button 버튼

하고 싶은 일

대표 코드

실제로 바뀌는 대상

요소 찾기

getElementById()

id가 붙은 특정 노드

내용 변경

textContent / innerHTML

노드 안의 텍스트 또는 HTML

요소 추가

createElement() + appendChild()

트리에 새로 붙는 노드