DOM Specifications

What is DOM?

A browser reads HTML and creates the DOM(Document Object Model) of the document with its structure and content. DOM is platform and language neutral API. W3C is responsible for the DOM specifications.

DOM specifications

DOM specifications are divided into multiple levels.

DOM levels:

  1. Level 0 supports an interface DOM
  2. Level 1 includes navigation of the HTML and XML documents. This level is divided into Core(representation of XML documents) and Html.
  3. Level 2 supports namespace, events and filtered views. There are 6 specifications in this level: the DOM2 Core(updates the content and structure dynamically), Views(access and update the content of HTML and XML), Events(access to programs and scripts), Style(access to css), Traversal(content of the document), Range(to create or delete a content) and HTML(access and update content and structure of HTML).
  4. Level 3 is an extension of DOM Level 2. It has such specifications as Core(updates the functionality of DOM1 and DOM2), Load and Save(exchange content from document into DOM and vice versa) and Validation(update content ensuring the document is valid).

How browsers implement the DOM?

Browsers have a software called Browser Engine which is responsible for creting DOM. Most browsers implement DOM using Javascripts (Chrome, Mozilla) Once the browser read HTML code it creates a JavaScript object Node. Node has some classes such as Attr, CharacterData, ProcessingInstruction and DocumentType. After creating Nodes the browser creates a tree-like structure of these same Nodes objects. After creating DOM the browser then reads CSS and construct CSSOM which same tree structure but for css objects. Finally, the browser creates the Rende-Tree which is a combination of DOM Tree and CSS Tree. A software called Browser ENgine

Summary

It was very interesting to find out more details about DOM. I found many intriguing facts I didnt know before like that browsers implement DOM using Javascript however, Javascript doesnt understand what DOM is as its not a part of JS specifications. Another interesting fact is that browsers implement DOM by creating JavaScript Nodes. Thus, Javascript seems to be a very powerful language no wonder it is harder to learn comparing to HTML and CSS.