profile

코드잇

2023. 4. 14
DOM (Document Object Model)

문서 객체 모델 (DOM)에 대하여

문서 객체 모델(DOM)은 인터넷 브라우저에서 사용하는 웹 페이지를 구성하는 객체 모델이다. DOM은 웹 페이지를 만들기 위해 HTML이나 XML 코드를 객체 기반의 계층 구조로 변환하는 데 도움이 된다.

DOM이란?

DOM은 문서 전체를 객체로 변환하여 간단하게 접근하고 조작할 수 있게 해주는 응용 프로그램 개발 인터페이스(API)이다. 사용자는 HTML 또는 XML 문서를 방문하면, DOM은 그 문서를 객체로 변환하고, 이 객체들은 웹 페이지의 각 부분을 조작하거나 제어하기 위해 사용된다.

DOM의 기능

DOM은 웹 문서를 객체 기반 계층 구조로 변환하여 사용할 수 있으며, 이 구조는 HTML 또는 XML 문서의 각 요소를 접근하고 변경할 수 있다. DOM의 또 다른 기능은 다른 웹 기술과 결합하는 것이다. 예를 들어, DOM을 사용하면 JavaScript를 이용해 웹 페이지에 동적으로 내용을 추가하거나 제거할 수 있다.

DOM 사용 예시

DOM을 사용하면 스크립트로 HTML 문서의 내용을 변경할 수 있다. 예를 들어, 다음 코드는 HTML 문서의 문자열을 변경한다.

document.getElementById("myText").innerHTML = "Hello World";

또한 DOM을 사용하면 문서 내의 각 요소를 스크립트로 제어할 수 있다. 예를 들어, 다음 코드는 HTML 문서의 배경색을 변경한다.

document.body.style.backgroundColor = "red";

결론

문서 객체 모델(DOM)은 웹 문서를 객체 기반 계층 구조로 변환하고 사용하기 쉽게 해주는 응용 프로그램 개발 인터페이스(API)이다. DOM은 HTML 또는 XML 문서의 내용을 스크립트로 변경하고 제어하기 위해 사용되며, 다른 웹 기술과도 결합할 수 있다.

이 튜토리얼은 어땠나요?

(주) 코드잇

대표KANG YOUNG HOON, 이윤수

개인정보보호책임자강영훈

사업자 번호313-86-00797

통신판매업제 2019-서울중구-1034 호

주소서울특별시 중구 청계천로 100 시그니쳐타워 동관 10층 코드잇