English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
문서 객체 모델, 일반적으로DOM، 이는 웹 사이트가 상호작용할 수 있게 하는 중요한 부분입니다。
문서 객체 모델창에 표시된 HTML 문서를 나타냅니다.
JavaScript가 웹 사이트의 내용, 구조 및 스타일을 처리할 수 있는 인터페이스입니다.
웹 페이지를 로드한 후, 브라우저는 해당 페이지의문서 객체 모델.
HTML DOM모델 구조의 트리오브젝트.
다음 예제는 DOM이 무엇인지 설명합니다:
<html> <head> <title>Example</title> </head> <h1>Example Page</h1> <p>This is an example page</p> </html>
위 코드의 DOM 표현은 다음과 같습니다:
HTML DOM은 HTML의 표준입니다오브젝트모델과프로그래밍 인터페이스. 그러나 그것은 정의합니다:
HTML 요소는오브젝트
모든 HTML 요소의속성
모든 HTML 요소에 접근할 수 있는메서드
모든 HTML 요소의이벤트
다시 말해:HTML DOM은 HTML 요소를 얻고, 변경하고, 추가하거나 제거하는 표준입니다.
객체 모델을 통해 JavaScript는 동적 HTML을 생성하기 위해 필요한 모든 기능을 얻습니다:
JavaScript는 페이지에서 모든 HTML 요소를 변경할 수 있습니다
JavaScript는 페이지에서 모든 HTML 속성을 변경할 수 있습니다
JavaScript는 페이지에서 모든 CSS 스타일을 변경할 수 있습니다
JavaScript는 기존 HTML 요소와 속성을 제거할 수 있습니다
JavaScript는 새로운 HTML 요소와 속성을 추가할 수 있습니다
JavaScript는 페이지에서 모든 기존 HTML 이벤트에 반응할 수 있습니다
JavaScript는 페이지에서 새로운 HTML 이벤트를 생성할 수 있습니다
이 튜토리얼의 다음 장에서는 다음을 배울 것입니다:
HTML 요소를 어떻게 찾을 수 있는지
HTML 요소의 내용을 어떻게 변경할 수 있는지
HTML 요소를 어떻게 추가하고 제거할 수 있는지
HTML 요소의 스타일(CSS)을 어떻게 변경할 수 있는지
HTML 속성을 어떻게 추가하고 제거할 수 있는지
DOM 트리를 어떻게 탐색할 수 있는지