Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

Ce chapitre fournit une brève référence des méthodes, propriétés et évènements généraux disponibles pour la plupart des éléments HTML et XML au sein du DOM des navigateurs utilisant Gecko.

Plusieurs spécifications du W3C s'appliquent aux éléments DOM :

Les articles listés ici couvrent ces différentes spécifications et fournissent des liens vers celles-ci aux endroits appropriés.

Bien que ces interfaces soient généralement partagées par la plupart des éléments HTML et XML, il en existe d'autres, plus spécialisées, pour des objets particuliers listés dans la spécification DOM HTML — par exemple les interfaces de l'élément HTML Table et de l'élément HTML Form.

Propriétés

Nom Description Type Disponibilité
attributes Tous les attributs associés à un élément. NamedNodeMap Toujours
childNodes Tous les nœuds enfants d'un élément. NodeList Toujours
className Définit ou obtient la classe de l'élément. String HTML, XUL
clientHeight La hauteur intérieure d'un élément. Number HTML
clientLeft L'épaisseur en pixels de la bordure gauche d'un élément. Number HTML
clientTop L'épaisseur en pixels de la bordure supérieure d'un élément. Number HTML
clientWidth La largeur intérieure d'un élément. Number HTML
dir Renvoie/définit le sens d'écriture d'un élément. String HTML, XUL
firstChild Le premier nœud enfant direct d'un élément, ou null si l'élément n'a pas de nœuds enfants. Node Toujours
id Définit ou obtient l'identifiant (id) de l'élément courant. String HTML, XUL
innerHTML Renvoie ou définit l'ensemble du balisage et du texte contenu au sein d'un élément donné. String HTML
lang Renvoie ou définit la langue des valeurs d'attribut, du texte et du contenu d'un élément. String HTML
lastChild Le dernier nœud enfant direct d'un élément, ou null si cet élément n'a pas de nœuds enfants. Node Toujours
localName La partie locale du nom qualifié d'un élément. String Toujours
Nom Description Type Disponibilité
name Définit ou obtient l'attribut name d'un élément. String HTML
namespaceURI L'URI de l'espace de noms d'un nœud, ou null si celui-ci n'est pas spécifié. String Toujours
nextSibling Le nœud suivant immédiatement celui donné dans l'arbre, ou null s'il n'y en a pas. Node Toujours
nodeName Le nom du nœud. String Toujours
nodeType Un nombre représentant le type du nœud. Celui-ci vaut toujours 1 pour les éléments DOM. Number Toujours
nodeValue La valeur du nœud. Celle-ci vaut toujours null pour les éléments DOM. String Toujours
offsetHeight La hauteur d'un élément tel qu'affiché. Number HTML
offsetLeft La distance entre le bord gauche d'un élément et le bord gauche de l'élément parent dans la mise en page (offsetParent). Number HTML
offsetParent L'élément par rapport auquel toutes les distances sont calculées. Element HTML
offsetTop La distance entre le bord supérieur d'un élément et le bord supérieur de l'élément parent dans la mise en page (offsetParent). Number HTML
offsetWidth La largeur d'un élément tel qu'affiché. Number HTML
ownerDocument Le document dans lequel un nœud apparait, ou null si le nœud n'est pas dans un document. Document Toujours
Nom Description Type Disponibilité
parentNode Le nœud parent d'un élément, ou null si le nœud n'est pas dans un document DOM. Node Toujours
prefix Le préfixe de l'espace de noms d'un nœud, ou null si celui-ci n'est pas spécifié. String Toujours
previousSibling Le nœud précédant immédiatement le nœud donné dans l'arbre, ou null s'il n'y en a pas. Node Toujours
scrollHeight La hauteur de la zone défilable d'un élément. Number HTML
scrollLeft Définit ou obtient le nombre de pixels duquel on fait défiler l'élément vers la gauche. Number HTML
scrollTop Définit ou obtient la distance entre le haut d'un élément et la portion supérieur de son contenu actuellement visible. Number HTML
scrollWidth La largeur de la zone défilable d'un élément. Number HTML
style Un objet représentant les déclarations de l'attribut style de l'élément. CSSStyleDeclaration HTML, XUL
tabIndex Définit ou obtient la position de l'élément dans l'ordre de tabulation. Number HTML
tagName Le nom de la balise d'un élément donné. String Toujours
textContent Définit ou obtient le contenu textuel d'un élément et de ses descendants. String Toujours

Méthodes

Nom et description Type de retour Disponibilité
addEventListener( type, listener, useCapture )
Enregistre un gestionnaire pour un type d'évènement particulier sur l'élément.
- Toujours
appendChild( appendedNode )
Insère un nœud comme dernier nœud enfant de l'élément.
Node Toujours
blur()
Retire le focus clavier de l'élément courant.
- HTML, XUL
click()
Simule un clic sur l'élément courant.
- HTML, XUL
cloneNode( deep )
Clone un nœud, et optionnellement tout son contenu.
Node Toujours
dispatchEvent( event )
Transmet un évènement à ce nœud dans le DOM.
Boolean Toujours
focus()
Positionne le focus clavier sur l'élément courant.
- HTML, XUL
getAttribute( name )
Renvoie la valeur de l'attribut spécifié pour le nœud courant.
Object Toujours
getAttributeNS( namespace, name )
Renvoie la valeur de l'attribut du nom et de l'espace de noms spécifiés pour le nœud courant.
Object Toujours
getAttributeNode( name )
Renvoie la représentation sous forme de nœud de l'attribut spécifié pour le nœud courant.
Attr Toujours
getAttributeNodeNS( namespace, name )
Renvoie la représentation sous forme de nœud de l'attribut du nom et de l'espace de noms spécifiés pour le nœud courant.
Attr Toujours
Nom et description Type de retour Disponibilité
getElementsByTagName( name )
Renvoie l'ensemble de tous les éléments descendants de l'élément courant portant un nom particulier.
NodeList Toujours
getElementsByTagNameNS( namespace, name )
Renvoie l'ensemble de tous les éléments descendants de l'élément courant portant un nom et un espace de noms particuliers.
NodeList Toujours
hasAttribute( name )
Vérifie si l'élément possède ou non l'attribut spécifié.
Boolean Toujours
hasAttributeNS( namespace, name )
Vérifie si l'élément possède ou non un attribut du nom et de l'espace de noms spécifiés.
Boolean Toujours
hasAttributes()
Vérifie si l'élément possède au moins un attribut.
Boolean Toujours
hasChildNodes()
Vérifie si l'élément possède au moins un nœud enfant.
Boolean Toujours
insertBefore( insertedNode, adjacentNode )
Insère le premier nœud juste avant le second nœud, parmi les nœuds enfants de l'élément courant, dans l'arbre DOM.
Node Toujours
normalize()
Nettoie tous les nœuds texte sous cet élément (en fusionnant les nœuds texte adjacents et en supprimant les nœuds texte vides).
- Toujours
removeAttribute( name )
Retire l'attribut spécifié du nœud courant.
- Toujours
removeAttributeNS( namespace, name )
Retire l'attribut portant nom et l'espace de noms spécifiés du nœud courant.
- Toujours
Nom et description Type de retour Disponibilité
removeAttributeNode( name )
Retire la représentation sous forme de nœud de l'attribut spécifié du nœud courant.
- Toujours
removeChild( removedNode )
Retire un nœud enfant du nœud courant.
Node Toujours
removeEventListener( type, handler )
Retire un gestionnaire d'évènement de l'élément.
- Toujours
replaceChild( insertedNode, replacedNode )
Remplace un nœud enfant de l'élément courant par un autre.
Node Toujours
scrollIntoView( alignWithTop )
Fait défiler la page jusqu'à ce que l'élément devienne visible.
- HTML
setAttribute( name, value )
Définit la valeur de l'attribut spécifié pour le nœud courant.
- Toujours
setAttributeNS( namespace, name, value )
Définit la valeur de l'attribut portant le nom et l'espace de noms spécifiés pour le nœud courant.
- Toujours
setAttributeNode( name, attrNode )
Définit la représentation sous forme de nœud de l'attribut spécifié pour le nœud courant.
- Toujours
setAttributeNodeNS( namespace, name, attrNode )
Définit la représentation sous forme de nœud de l'attribut portant le nom et l'espace de noms spécifiés pour le nœud courant.
- Toujours

Devrait figurer sur une page traitant de NodeList  ; item: Retrouve un nœud dans une <code>NodeList</code> par son indice. (DOM Core, ne fait pas partie de l'interface <code>Element</code>) ?? ; supports: Teste si cette implémentation du DOM gère une fonctionnalité particulière. (DOM Core)

Évènements

Ce sont des propriétés qui correspondent aux attributs d'évènements HTML « on ».

Contrairement aux attributs correspondants, les valeurs de ces propriétés sont des fonctions (ou tout autre objet implémentant l'interface EventListener) plutôt que des chaînes de caractères. En fait, assigner un attribut d'évènement en HTML crée une fonction enveloppante autour du code spécifié. Par exemple, avec le code HTML suivant :

<div onclick="foo();">cliquez ici</div>

Si element est une référence vers cet élément div, la valeur de element.onclick sera :

function onclick(event) {
  foo();
}

Notez la façon dont l'objet event est passé comme paramètre event à cette fonction enveloppante.

onblur
Renvoie le code de gestion d'évènement pour l'évènement blur (perte de focus).
onchange
Renvoie le code de gestion d'évènement pour l'évènement change (modification).
onclick
Renvoie le code de gestion d'évènement pour l'évènement click (clic).
ondblclick
Renvoie le code de gestion d'évènement pour l'évènement dblclick (double clic).
onfocus
Renvoie le code de gestion d'évènement pour l'évènement focus (obtention du focus).
onkeydown
Renvoie le code de gestion d'évènement pour l'évènement keydown (touche enfoncée).
onkeypress
Renvoie le code de gestion d'évènement pour l'évènement keypress (touche pressée).
onkeyup
Renvoie le code de gestion d'évènement pour l'évènement keyup (touche relachée).
onmousedown
Renvoie le code de gestion d'évènement pour l'évènement mousedown (bouton de la souris enfoncé).
onmousemove
Renvoie le code de gestion d'évènement pour l'évènement mousemove (déplacement de la souris).
onmouseout
Renvoie le code de gestion d'évènement pour l'évènement mouseout (sortie du pointeur de la souris).
onmouseover
Renvoie le code de gestion d'évènement pour l'évènement mouseover (passage du pointeur de la souris par dessus l'élément).
onmouseup
Renvoie le code de gestion d'évènement pour l'évènement mouseup (relachement du bouton de la souris).
onresize
Renvoie le code de gestion d'évènement pour l'évènement resize (redimensionnement).
onscroll
Renvoie le code de gestion d'évènement pour l'évènement scroll.

Autres évènements

D'autres Évènements DOM existent, comme DOMSubtreeModified, DOMAttrModified, etc. ainsi que des Évènements DOM spécifiques à Gecko comme DOMContentLoaded, DOMTitleChanged, etc.

Étiquettes et contributeurs liés au document

 Dernière mise à jour par : soumya,