1. 문서 객체 모델이란 : 자바스크립트를 이용하여 웹 문서에 접근하고 제어할 수 있도록 객체를 사용해 웹 문서를 체계적으로 정리하는 방법
- 웹 문서와 그 안의 모든 요소를 '객체'로 인식하고 처리함
- (예시) 웹 문서 전체는 document 객체, 삽입한 이미지는 image 객체
2. DOM 트리
- 웹 문서에 있는 오쇼들 간의 부모, 자식 관계를 계층 구조로 표시한 것
- 나무 형태가 되기 때문에 "DOM 트리"라고 한다.
- 노드(node) : DOM 트리에서 가지가 갈라져 나간 항목
- 루트 노드(root node) : DOM 트리의 시작 부분(html)
3. DOM을 구성하는 원칙
- 모든 HTML 태그는 요소(element) 노드
- 웹 문서의 텍스트 내용은 요소 노드의 자식 노드인 텍스트(text) 노드
- 태그의 속성은 요소 노드의 자식 노드인 속성(attribute) 노드
- 주석은 주석(comment) 노드
3. DOM 요소에 접근하고 속성 가져오기
*DOM 요소에 접근하기 : 웹 문서에서 원하는 요소를 찾아가는 것을 "접근한다(access)" 고 함.
*getAttribute() 메서드 : 속성 노드의 값을 가져옴
*setAttribute() 메서도 : 속성 노드의 값을 바꿈
4. DOM에서 이벤트 처리하기
'개발 및 관리 > Javascript' 카테고리의 다른 글
| 자바스크립트, 객체 메소드(Object methods), 계산된 프로퍼티(Computed property) (0) | 2022.04.26 |
|---|---|
| 자바스크립트 DOM & Event (0) | 2022.04.26 |
| 자바스크립트와 객체 (0) | 2022.04.25 |
| 자바스크립트, 함수와 이벤트 (0) | 2022.04.15 |
| 자바스크립트 기본 문법 (0) | 2022.04.15 |
