What is the real idea behind the Document Object Model (DOM) concept?

I start in HTML and HTML5.
Since I read the following link, I found the terms DOM and DOM API , I read Wikipedia, but could not digest the whole idea.

Can someone explain to me:

  • the real idea behind the Document Object Model (DOM) concept?
  • How is this related to HTML5?

Thanks,
Sen

+4
source share
4 answers

From Wikipedia :

The Document Object Model (DOM) is a cross-platform and linguistic independence for the presentation and interaction with objects in HTML, XHTML and XML documents

Simply put, how browsers (among other clients) are web documents. The DOM is not HTML5. It was from the very beginning.

The DOM API basically means that you, as a programmer, can interact with the DOM. Some examples may be adding elements to the DOM, changing their styles and other general operations that you do in a web document.

In the context of HTML5, there are several additions to the DOM that were not present in previous versions of the HTML specification, such as the <video> and <audio> elements.

+5
source
  • The DOM is the internal representation of the HTML document browser.
  • The DOM API is a way to program the DOM using JavaScript in a browser.
  • HTML5 is just a new taste of HTML. It uses the DOM in exactly the same way.

As Mark Pilgrim says, there are some things you can do with HTML DOM elements through the DOM API, for example, start playing a video file. So, if you have a <video> DOM object in JavaScript, you can call its .play() method from JavaScript. This is an example of the DOM API.

+3
source

The document object model is an internal representation of the HTML browser. This is based on the idea of ​​"children." Thus, the <p> can contain several text nodes and several <span> tags, for example:

 <p><span>Hello,</span> this is some text. <span>It</span> is just a short paragraph</p> 

This <p> has 4 children: two <span> s and two text nodes ( this is some text and is just a short paragraph ). Other bits of text are children of the corresponding <span> tags.

The browser stores this information (instead of just storing a huge stream of HTML, which is very difficult to process) in internal memory. This makes it easy to format using cascading style sheets (CSS) and make changes to it using JavaScript (create and delete parts, move parts from one parent to another, etc.).

All versions of HTML (except perhaps very early ones) use the DOM. Each version has rules, such as tags, which can be children of each element. These rules are implemented when processing HTML and creating a DOM representation.

0
source

dom is an html representation of programmed objects, each web page is a collection of DOM objects

0
source

All Articles