How is the DOM Document build from an HTML document ?

About

This page is about the construction of the DOM document from a HTML document (ie the XML language is xhtml)

In a HTML context, the DOM is also known as the API for HTML.

Creation

The HTML dom document is created:

Structure

In a html dom document:

Example

Base

<!DOCTYPE html>
<html>
 <head>
  <title>My titel</title>
 </head>
 <body>
  <h1>My First chapter</h1>
  <p>My text and <a href="#link">my link</a></p>
  <!-- comment -->
 </body>
</html>
  • create the following DOM document where:
    • The head element creates a head node that contains a title node, which itself contains a Text node with the text “My titel”.
    • Similarly, the body element creates a body node that contains an h1 node, a p node, and a comment node.

where the tags are:

Second Example

Second example of HTML DOM tree

with the following HTML document

<!-- tells the browser what language it's reading -->
<!DOCTYPE html>
<!-- Starts the HTML document -->
<html>
 <head>
  <title>Sample page</title>
 </head>
 <body>
  <h1>Sample page</h1>
  <p>This is a <a href="demo.html">simple</a> sample.</p>
  <!-- this is a comment -->
 </body>
<!-- Ends the HTML document -->
</html>

we would get the following html document. (not that \n is end of line)

DOCTYPE: html
html
    head
        #text: '\r   '
        title
            #text: Sample page
        #text: '\n   '
    #text: '\n  '
    body
        #text: '\n   '
        h1
            #text: Sample page
        #text: '\n   '
        p
            #text: 'This is a '
            a href="demo.html"
                 #text: simple
            #text: sample.
        #text: '\n   '
        #comment: this is a comment
        #text: '\n   '

Specification

The API for HTML developed by browser vendors were specified and published under the name:

  • DOM Level 1 (in 1998)
  • DOM Level 2 Core
  • and DOM Level 2 HTML.

To avoid exposing Web authors to the complexities of multithreading, the HTML and DOM APIs are designed such that the execution of all scripts is serialized.

An XML DTDs cannot express all the conformance requirements of this specification.


Powered by ComboStrap