DOM(Document Object Model)

• DOM은 HTML용 표준 객체 모델이자 프로그래밍 인터페이스
• DOM 모델은 객체 트리로 구성
• DOM은 객체로서의 HTML요소와 속성, 요소에 엑세스 방법, 이벤트 등을 정의
• DOM은 HTML요소에 접근, 변경, 추가, 삭제 등의 방법에 대한 표준 기법

요소 선택

• document.getElementById(id) HTML 요소의 ID로 선택하는 방법
• document.getElementsByTagName(tagName) HTML 요소의 태그명으로 선택하는 방법 해당 요소들을 HTMLCollction 객체로 획득
• document.getElementsByClassName(ClassName) HTML 요소의 클래스명으로 선택하는 방법 해당 요소들을 HTMLCollction 객체로 획득
• document.querySelector('selector') CSS 선택자로 요소를 선택하는 방법 복수일 경우 가장 첫 번째 요소만 선택
• document.querySelectorAll('selector') CSS 선택자로 요소를 선택하는 방법 복수일 경우 모두 선택, NodeList 객체

요소 조작

• Element.textContent 컨텐츠를 획득 및 변경 순수한 텍스트 데이터를 전달
• Element.innerHTML 컨텐츠를 회득 및 변경 태그는 태그로 인식해서 전달
• Element.setAttribute(속성명, 값) 요소에 속성을 추가
• Element.removeAttribute(속성명) 요소의 속성을 제거

요소 스타일링

• Element.style HTML 요소에 인라인 스타일 추가