문서 객체 모델

Document Object Model
문서 객체 모델
DOM-model.svg
HTML 문서의 DOM 계층 구조 예제
약어돔
초간출판1998년 10월 1일; 23년 전(1998-10-01)
최신 버전DOM4[1]
2015년 11월 19일; 6년 전(2015-11-19)
조직월드 와이드 웹 컨소시엄, WHTWG
기준 표준WHTWG DOM 생활표준
W3C DOM4
HTML
비교

DOM(Document Object Model)은 XML이나 HTML 문서를 트리 구조로 취급하는 교차 플랫폼 및 언어 독립 인터페이스로, 각 노드에서 문서의 일부를 나타내는 객체가 된다.DOM은 논리 트리가 있는 문서를 나타낸다.트리의 각 분기는 노드로 끝나며, 각 노드에는 개체가 포함되어 있다.DOM 방법은 트리에 프로그래밍 방식으로 접근할 수 있으며, 트리를 사용하여 문서의 구조, 스타일 또는 내용을 변경할 수 있다.노드는 이벤트 핸들러를 부착할 수 있다.이벤트가 트리거되면 이벤트 핸들러가 실행된다.[2]

DOM의 주요 표준화는 2004년에 마지막으로 권고안을 개발한 W3C(World Wide Web Consortium, W3C)에 의해 처리되었다.WHTWG가 표준의 개발을 이어받아 이를 살아있는 문서로 공표했다.W3C는 이제 WHTWG 표준의 안정적인 스냅샷을 발행한다.

역사

Document Object Model의 역사는 Netscape Navigator와 Microsoft Internet Explorer 사이의 1990년대 후반의 "브라우저 전쟁"의 역사뿐만 아니라 웹 브라우저의 자바스크립트 엔진에서 널리 구현된 최초의 스크립팅 언어인 JavaScript와 JScript의 역사와 얽혀 있다.

자바스크립트는 Netscape Communications에 의해 1995년 Netscape Navigator 2.0 내에서 출시되었다.넷스케이프의 경쟁사인 마이크로소프트는 이듬해 JScript라는 자바스크립트의 재구성과 함께 Internet Explorer 3.0을 출시했다.JavaScript와 JScript를 통해 웹 개발자는 클라이언트 쪽 상호 작용성을 가진 웹 페이지를 만들 수 있다.이러한 언어의 1세대에서 사용자 생성 이벤트를 검출하고 HTML 문서를 수정하는 제한된 시설은 결국 "DOM 레벨 0" 또는 "레거시 DOM"으로 알려지게 되었다. DOM 레벨 0에 대한 독립된 표준은 개발되지 않았지만 HTML 4의 규격에 부분적으로 설명되었다.

레거시 DOM은 접근할 수 있는 요소의 종류에 제한이 있었다.양식, 링크 및 이미지 요소는 루트 문서 개체에서 시작된 계층 이름으로 참조될 수 있다.계층 이름은 통과된 요소의 이름 또는 순차적 색인을 사용할 수 있다.예를 들어, 양식 입력 요소는 다음 중 하나로 액세스할 수 있다.document.formName.inputName또는document.forms[0].elements[0].

레거시 DOM은 클라이언트 측 양식 검증 및 툴팁 생성과 같은 단순한 인터페이스 상호작용을 가능하게 했다.

1997년 넷스케이프와 마이크로소프트는 각각 넷스케이프 네비게이터 4.0 버전과 Internet Explorer를 출시하면서 로드된 HTML 문서에 대한 변경을 가능하게 하는 DHTML(Dynamic HTML) 기능에 대한 지원을 추가했다.DHTML은 레거시 DOM 구현에서 사용할 수 있는 기본 문서 객체에 대한 확장이 필요했다.JScript가 JavaScript를 기반으로 했기 때문에 레거시 DOM 구현은 대체로 호환성이 높았지만, DHTML DOM 확장은 각 브라우저 메이커에 의해 병렬로 개발되어 호환성이 없는 상태로 유지되었다.이러한 버전의 DOM은 "중간 DOM"으로 알려지게 되었다.

ECMAScript의 표준화 후, W3C DOM 작업 그룹은 표준 DOM 규격 초안을 작성하기 시작했다."DOM 레벨 1"로 알려진 완성된 규격은 1998년 말 W3C 권고안이 되었다.2005년까지 W3C DOM의 큰 부분은 Microsoft Internet Explorer 버전 6(2001년부터), Opera, Safari 및 Gecko 기반 브라우저(Mozilla, Firefox, SeaMonkey, Camino 등)를 포함한 일반적인 ECMAScript 지원 브라우저에 의해 잘 지원되었다.

표준

왓위그 돔

W3C DOM 작업 그룹은 최종 권고안을 발표하였고, 이후 2004년에 해체되었다.개발 노력은 생활 수준을 계속 유지하고 있는 WHTWG로 이전되었다.[3]2009년에 웹 애플리케이션 그룹은 W3C에서 DOM 활동을 재구성했다.[4]2013년에는, HTML5의 진행 부족과 출시가 임박함에 따라, HTML 작업 그룹에 DOM 레벨 4 사양을 재지정하여, 신속한 완료를 도모 레벨 4 사양을 HTML 작업 그룹에 재지정하였다.[5]그러던 중 2015년 웹 애플리케이션 그룹이 해체되고 DOM 책임론이 웹 플랫폼 그룹으로 넘어갔다.[6]W3C는 2015년 DOM 레벨 4의 발표를 시작으로 WHTWG 표준의 스냅샷을 기반으로 새로운 권고안을 작성한다.

  • DOM 레벨 1은 문서의 어떤 부분을 변경하기 위한 수단을 포함하여 전체 HTML 또는 XML 문서에 대한 완전한 모델을 제공했다.
  • DOM 레벨 2는 2000년 말에 출판되었다.그것을 소개하였다.getElementByIdXML 네임스페이스와 CSS에 대한 지원 및 이벤트 모델뿐만 아니라 기능.
  • 2004년 4월에 발표된 DOM 레벨 3에서는 XPath 및 키보드 이벤트 처리 지원뿐만 아니라 문서를 XML로 직렬화하기 위한 인터페이스를 추가했다.
  • DOM 레벨 4는 2015년에 출판되었다.WHTWG 생활수준의 스냅사진이다.[7]

적용들

웹 브라우저

HTML 페이지와 같은 문서를 렌더링하기 위해 대부분의 웹 브라우저는 DOM과 유사한 내부 모델을 사용한다.모든 문서의 노드는 "Document object"라는 이름의 맨 위 노드와 함께 DOM 트리라는 트리 구조로 구성된다.브라우저에서 HTML 페이지를 렌더링하면 브라우저는 HTML을 로컬 메모리에 다운로드하여 자동으로 구문 분석하여 화면에 페이지를 표시한다.그러나, DOM이 반드시 트리로 표현될 필요는 없으며,[8] 일부 브라우저들은 다른 내부 모델을 사용하였다.[9]

자바스크립트

웹 페이지가 로드되면 브라우저는 페이지의 Document Object Model을 생성하는데, 이것은 JavaScript와 문서 자체의 인터페이스 역할을 하는 HTML 문서의 객체 지향적 표현이다.페이지 내에서 JavaScript는 다음을 가능하게 하기 때문에 동적 웹 페이지를 만들 수 있다.[10]

  • HTML 요소 및 속성 추가, 변경 및 제거
  • CSS 스타일 변경
  • 기존의 모든 사건에 반응하다.
  • 새로운 이벤트를 만들다

구현

DOM은 임의의 방향(예: 부모 및 이전 형제)으로 탐색을 지원하고 임의의 수정을 허용하기 때문에, 구현은 적어도 지금까지 읽은 문서(또는 일부 구문 분석된 형태)를 완충해야 한다.[11]

레이아웃 엔진

참고 항목:JavaScript 엔진 비교(DOM 지원)

웹 브라우저는 HTML을 DOM으로 구문 분석하기 위해 레이아웃 엔진에 의존한다.Trident/MSHTML과 같은 일부 레이아웃 엔진은 주로 또는 Internet Explorer와 같은 특정 브라우저와 독점적으로 연결된다.Blink, WebKit, Gecko를 포함한 다른 것들은 Google Chrome, Opera, Safari, Firefox와 같은 다수의 브라우저에 의해 공유된다.서로 다른 레이아웃 엔진은 DOM 표준을 다양한 준수 수준으로 구현한다.

도서관

DOM 구현:

  • libxml2
  • MSXML
  • Xerces는 C++, Java 및 Perl로 작성된 DOM 구현의 모음입니다.
  • xml.dom for Python
  • <SCRIPT>용 XML은 자바스크립트 기반 DOM 구현이다[12].
  • PHP.Gt DOM은 libxml2에 기반한 서버측 DOM 구현이며 PHP 프로그래밍 언어에 DOM 레벨 4 호환성을[13] 가져온다.
  • Domino는 Mozilla의 dom.js에 기반한 서버측(Node.js) DOM 구현이다.Domino는 Visual Editor가 있는 MediaWiki 스택에서 사용된다.
  • SimpleHtmlDom은 프로그램적으로 HTML 문자열을 생성할 수 있는 C#의 간단한 HTML 문서 객체 모델이다.

DOM 구현을 표시하는 API:

  • JAXP(Java API for XML Processing)는 DOM 제공자에 액세스하기 위한 API이다.
  • Lazarus (Free Pascal IDE)는 UTF-8과 ANSI 형식의 두 가지 DOM을 포함한다.

검사 도구:

참고 항목

참조

  1. ^ 모든 버전 지정은 W3C DOM만 참조한다.
  2. ^ "Document Object Model (DOM)". W3C. Retrieved 2012-01-12. The Document Object Model is a platform- and language-neutral interface that will allow programs and scripts to dynamically access and update the content, structure and style of documents.
  3. ^ "DOM Standard". Retrieved 23 September 2016.
  4. ^ "W3C Document Object Model". Retrieved 23 September 2016.
  5. ^ (plh@w3.org), Philippe Le Hegaret. "New Charter for the HTML Working Group from Philippe Le Hegaret on 2013-09-30 (public-html-admin@w3.org from September 2013)". Retrieved 23 September 2016.
  6. ^ "PubStatus - WEBAPPS". Retrieved 23 September 2016.
  7. ^ "W3C DOM4". Retrieved 8 January 2021.
  8. ^ "What is the Document Object Model?". W3C. Retrieved 2021-09-12. However, the DOM does not specify that documents must be implemented as a tree or a grove, nor does it specify how the relationships among objects be implemented. The DOM is a logical model that may be implemented in any convenient manner.
  9. ^ "Modernizing the DOM tree in Microsoft Edge". Microsoft. 19 April 2017. Retrieved 2021-09-12.
  10. ^ "JavaScript HTML DOM". Retrieved 23 September 2016.
  11. ^ Kogent Solutions Inc. (2008). Ajax Black Book, New Edition (With Cd). Dreamtech Press. p. 40. ISBN 978-8177228380.
  12. ^ "XML for <SCRIPT> Cross Platform XML Parser in JavaScript". Retrieved 23 September 2016.
  13. ^ "The modern DOM API for PHP 7 projects". 5 December 2021.

일반참조

외부 링크