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 :
- La spécification DOM Core — traduction en français (non normative) — décrit les interfaces du noyau partagées par la plupart des objets DOM dans les documents HTML et XML
- La spécification DOM HTML — traduction en français (non normative) — décrit les interfaces pour les objets des documents HTML et XHTML construits sur base de la spécification DOM Core
- La spécification DOM Events — traduction en français (non normative) — décrit les évènements partagés par la plupart des objets DOM, sur base des spécifications DOM Core et Views — traduction en français (non normative).
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.