Document HTML DOM JavaScript

L'objet Document HTML DOM est le propriétaire de tous les autres objets de votre page web.

Objet Document HTML DOM

L'objet document représente votre page web.

Si vous souhaitez accéder à n'importe quel élément de la page HTML, vous devez toujours commencer par accéder à l'objet document.

Voici quelques exemples sur la manière d'utiliser l'objet document pour accéder et manipuler l'HTML.

Recherche d'éléments HTML

Méthode Description
document.getElementById(id) Trouver des éléments par leur id d'élément
document.getElementsByTagName(nom) Trouver des éléments par leur nom de balise
document.getElementsByClassName(nom) Trouver des éléments par leur nom de classe

Changer l'élément HTML

Méthode Description
element.innerHTML = nouveau contenu HTML Changer l'HTML interne de l'élément
element.attribute = new value Modification de la valeur d'attribut d'un élément HTML
element.setAttribute(attribute, value) Modification de la valeur d'attribut d'un élément HTML
element.style.property = new style Modification du style d'un élément HTML

Ajout et suppression d'éléments

Méthode Description
document.createElement(element) Création d'un élément HTML
document.removeChild(element) Suppression d'un élément HTML
document.appendChild(element) Ajout d'un élément HTML
document.replaceChild(element) Remplacement d'un élément HTML
document.write(text) Écrire dans le flux de sortie HTML

Ajout d'un gestionnaire d'événement

Méthode Description
document.getElementById(id).onclick = function(){code} Ajout d'un gestionnaire d'événement onclick

Recherche d'objets HTML

Premier niveau HTML DOM 1 (1998), définissant 11 objets HTML, collections d'objets et propriétés. Ils restent valides dans HTML5.

Plus tard, au niveau HTML DOM 3, d'autres objets, collections et propriétés ont été ajoutés.

Propriétés Description DOM
document.anchors Renvoie tous les éléments <a> avec l'attribut name. 1
document.applets Renvoie tous les éléments <applet>(Non recommandé dans HTML5) 1
document.baseURI Renvoie l'URI de repère absolu du document 3
document.body Renvoie l'élément <body> 1
document.cookie Renvoie les cookies du document 1
document.doctype Renvoie le doctype du document 3
document.documentElement Renvoie l'élément <html> 3
document.documentMode Renvoie le mode utilisé par le navigateur 3
document.documentURI Renvoie l'URI du document 3
document.domain Renvoie le nom de domaine du serveur de document 1
document.domConfig Abandonné.Renvoie la configuration DOM 3
document.embeds Renvoie tous les éléments <embed> 3
document.forms Retourne tous les éléments <form> 1
document.head Retourne l'élément <head> 3
document.images Retourne tous les éléments <img> 1
document.implementation Retourne l'implémentation DOM 3
document.inputEncoding Retourne l'encodage du document (jeu de caractères) 3
document.lastModified Retourne la date et l'heure de mise à jour du document 3
document.links Retourne tous les éléments <area> et <a> avec l'attribut href 1
document.readyState Retourne l'état (chargement) du document 3
document.referrer Retourne l'URI référencé (document lié) 1
document.scripts Retourne tous les éléments <script> 3
document.strictErrorChecking Retourne si la vérification des erreurs obligatoire est exécutée 3
document.title Retourne l'élément <title> 1
document.URL Retourne l'URL complète du document 1