Tutoriel DOM

DOM, le modèle objet de document, permet d'interfacer les langages de programmation avec les documents XML en les associant avec un modèle orienté objet.

Cela permet d'accéder individuellement à chaque élément. On verra dans ce tutoriel que l'on peut ainsi modifier chaque élément d'une page, ou créer un page ou une partie grâce au DOM.

Ce tutoriel est basé sur DOM core 2, implémenté par tous les navigateurs.

Nous décrivons les interfaces et comment les utiliser: liste des attributs, liste des méthodes, accès au contenu, ajouter des éléments (exemple: inclure une autre page), modifier le contenu, supprimer des éléments.

Objets et méthodes

DOM permet de retrouver les éléments du document

Introduction

Ce qu'est DOM et comment l'utiliser.

Structure et hiérarchie des interfaces de DOM Core Level 2

Objets et dérivés dans un document.

Node

Chaque élément d'une page est un objet node. Ses méthodes et attributs.

NodeList

List de Nodes, et méthodes.

Document et HTMLDocument

Le document lui-même est un objet DOM. HTMLDocument est un sous-objet pour une page Web.

Etudes de cas

Remplacer une image ou changer le fond d'écran

Les objets DOM et leurs propriétés sont suffisantes pour modifier les éléments graphiques d'une page Web.

Afficher dynamiquement une vidéo par l'utilisation de Node

Références

• Recommandation DOM 1. Elle spécifie les attributs et méthodes principaux de l'interface DOM.
• Recommandation DOM 2. Par le W3C.
• Spécification DOM 3. Esquisse du niveau 3.