6. Sous le capot: Le Document Objet Model (DOM)

L'API (application programming interface) pour documents HTML et XML sert à

construire des documents (navigateurs)
naviguer dans leur structure avec un programme
ajouter, modifier ou détruire des éléments avec un langage de programmation comme PHP (du côté serveur) ou JavaScript (dans votre navigateur)
Cela a permi de standardiser ce qu'on appelle "DHTML"

Le terme DHTML ne se retrouve dans aucun standard, mais indique qu'on manipule les propriétés CSS et le contenu des éléments avec JavaScript

Définition officielle du terme "DOM":

De l'abstract de la spécification (http://www.w3.org/TR/REC-DOM-Level-1/): a platform- and language-neutral interface that allows programs and scripts to dynamically access and update the content, structure and style of documents. The Document Object Model provides a standard set of objects for representing HTML and XML documents, a standard model of how these objects can be combined, and a standard interface for accessing and manipulating them. Vendors can support the DOM as an interface to their proprietary data structures and APIs, and content authors can write to the standard DOM interfaces rather than product-specific APIs, thus increasing interoperability on the Web.

Note: Le DOM est compliqué: Il existe des alternatives plus simples !

6.1 Le principe du DOM avec un exemple

Exemple 6-1: Un simple table HTML comme "DOM tree"

voir: REC-DOM-Level-1.19981001

Les données XML:

<TABLE>  <TBODY>

<TR> <TD>Pierre Muller</TD>

      <TD>http://pm.com/</TD> </TR>

<TR> <TD>Elisabeth Dupont</TD>

      <TD></TD> </TR>

</TBODY> </TABLE>

Affichage typique dans un browser:

Pierre Muller	http://pm.com/
Elisabeth Dupont

Représentation alternative dans un browser ou un applet:

line 1:

Pierre Muller
http://pm.com/

line 2:

Elisabeth Dupont

Représentation interne très APPROXIMATIVE de l'arbre dans le DOM

Un script peut manipuler cette structure au niveau du contenu, de l'affichage et de l'interface utilisateur

Javascript dans les navigateurs Web
Java, Flash (et autres) dans des extensions (applets, Flash player).
PhP, Java, ASP etc. au niveau du serveur

Grâce au DOM: changement de paradigme pour les pages Internet:
Display quasi-statique => filtrages, multiples feuilles de style, applications, etc. (web 2.0)