DOM Intro, JavaScript HTML DOM

• JavaScript HTML DOM

HTML DOM으로 JavaScript는 HTML 문서의 모든 요소에 접근하여 변경할 수 있습니다.

웹 페이지가 로드될 경우, 브라우저는 해당 페이지의 Documnt Object Model을 생섷합니다.

HTML DOM 모델은 오브젝트 트리로 구성됩니다.


오브젝트 모델로, JavaScript는 동적 HTML을 만들기 위해 필요한 모든 권한을 가집니다.

• JavaScript는 해당 페이지의 모든 HTML 요소를 변경할 수 있습니다.
• JavaScript는 해당 페이지의 모든 HTML 속성을 변경할 수 있습니다.
• JavaScript는 해당 페이지의 모든 CSS 스타일일 변경할 수 있습니다.
• JavaScript는 존재하는 HTML 요소와 속성들 제거할 수 있습니다.
• JavsScript는 해당 페이지에서 존재하는 모든 HTML 이벤트에 반응할 수 있습니다.
• JavaScript는 해당 페이지에서 새로운 HTML 이벤트를 만들 수 있습니다.

본 튜토리얼의 다음 챕터에서, 하기의 내용을 배웁니다.:

• HTML 요소들의 콘텐츠를 변경하는 방법
• HTML 요소들의 스타일(CSS)을 변경하는 방법
• HTML DOM 이벤트에 반응하는 방법
• HTML 요소를 추가하고 삭제하는 방법

DOM은 W3C (World Wide Web Consortium) 표준입니다.

DOM은 문서에 접근하는 표준을 정의합니다.

“The W3C Document Object Model (DOM)“은 프로그램과 스크립트가 동적으로 문서의 콘텐츠, 구조, 그리고 스타일에 접근하여 업데이트를 허용하는 플랫폼이며 언어 중립적 인터페이스입니다.

W3C DOM 표준은 3개의 부분으로 구별됩니다:

• Core DOM - 모든 타입의 문서에 대한 표준 모델
• XML DOM - XML 문서에 대한 표준 모델
• HTML DOM - HTML 문서에 대한 표준 모델

HTML DOM은 HTML을 위한 표준 오브젝트 모델이며, 프로그래밍 인터페이스입니다.

• 오브젝트로의 HTML 요소
• 모든 HTML 요소들의 속성
• 모든 HTML 요소들에 접근하는 메서드(methods)
• 모든 HTML 요소들에 대한 이벤트

즉, HTML DOM은 HTML 요소들을 가져오고, 변경, 추가 또는 삭제하는 표준입니다.