--- title: Element slug: Web/API/Element translation_of: Web/API/Element browser-compat: api.Element ---
Element est la classe de base la plus générique dont héritent tous les objets qui représentent des éléments d'un Document. Elle contient uniquement des méthodes et propriétés communes à l'ensemble des éléments. Des classes plus spécifiques héritent d'Element. Ainsi, l'interface HTMLElement correspond à l'interface de base pour les éléments HTML tandis que l'interface SVGElement représente la base pour les éléments SVG. La plupart des fonctionnalités sont définies dans les classes situées plus loin dans la hiérarchie.
Element hérite des propriétés de son interface parente : Node (et donc indirectement des propriétés du parent de celle-ci : EventTarget).
Element.assignedSlot{{readonlyInline}}HTMLSlotElement représentant l'emplacement (<slot>) dans lequel le nœud est inséré.Element.attributes {{readOnlyInline}}NamedNodeMap contenant les attributs affectés de l'élément HTML correspondant.Element.childElementCount {{readonlyInline}}Element.children {{readonlyInline}}Element.classList {{readOnlyInline}}DOMTokenList contenant la liste des attributs de classe.Element.classNameDOMString qui représente la classe de l'élément.Element.clientHeight {{readOnlyInline}}Number) représentant la hauteur intérieure de l'élément.Element.clientLeft {{readOnlyInline}}Number) représentant la largeur de la bordure gauche de l'élément.Element.clientTop {{readOnlyInline}}Number) représentant la largeur de la bordure haute de l'élément.Element.clientWidth {{readOnlyInline}}Number) représentant la largeur intérieure de l'élément.Element.firstElementChild {{readonlyInline}}Element.idDOMString qui représente l'identifiant de l'élément.Element.innerHTMLDOMString qui représente le balisage du contenu de l'élément.Element.lastElementChild {{readonlyInline}}Element.localName {{readOnlyInline}}DOMString qui représente la partie locale pour le nom qualifié de l'élément.Element.namespaceURI {{readonlyInline}}null s'il n'y en a pas.
Note : Pour Firefox 3.5 et les versions antérieures, les éléments HTML ne sont pas situés dans un espace de noms. Dans les versions ultérieures, les éléments HTML s'inscrivent dans l'espace de noms http://www.w3.org/1999/xhtml tant pour les arbres HTML que XML.
Element.nextElementSibling {{readOnlyInline}}Element qui représente l'élément qui suit immédiatement l'élément courant dans l'arbre ou null si l'élément courant n'a pas de voisin.Element.outerHTMLDOMString qui représente le balisage de l'élément (incluant son contenu). Lorsque cette propriété est utilisée en modification, cela remplace l'élément avec les noeuds construits à partir de l'analyse de la chaîne de caractères fournie.Element.partpart) sous la forme d'un objet DOMTokenList.Element.prefix {{readOnlyInline}}DOMString qui représente le préfixe de l'espace de nom pour l'élément ou null si aucun préfixe n'est défini.Element.previousElementSibling {{readOnlyInline}}Element qui représente l'élément qui précède immédiatement l'élément courant dans l'arbre ou null si l'élément courant n'a pas de voisin.Element.scrollHeight {{readOnlyInline}}Number) représentant la hauteur de la vue de défilement pour l'élément.Element.scrollLeftNumber) qui représente le décalage à gauche de l'élément lié au défilement.Element.scrollLeftMax {{Non-standard_Inline}} {{readOnlyInline}}Number) représentant le décalage à gauche maximal pour l'élément lors du défilement.Element.scrollTopNumber) qui représente le nombre de pixels dont on a fait défiler verticalement le haut de l'élément.Element.scrollTopMax {{Non-standard_Inline}} {{readOnlyInline}}Number) représentant le décalage maximal depuis le haut de l'élément lors du défilement.Element.scrollWidth {{readOnlyInline}}Number) représentant la largeur de la vue de défilement pour l'élément.Element.shadowRoot{{readOnlyInline}}null si aucune racine sombre ouverte n'est présente.Element.openOrClosedShadowRoot {{Non-standard_Inline}}{{readOnlyInline}}Element.slot {{Experimental_Inline}}Element.tagName {{readOnlyInline}}String) qui est le nom de la balise pour l'élément courant.L'interface Element inclut les propriétés suivantes, définies sur le mixin ARIAMixin.
Element.ariaAtomicDOMString qui reflète l'attribut aria-atomic qui indique si des technologies d'assistance présenteront tout ou partie de la région modifiée selon les notifications définies par l'attribut aria-relevant.Element.ariaAutoCompleteDOMString qui reflète l'attribut aria-autocomplete qui indique si la saisie de texte peut déclencher l'affichage d'une ou plusieurs prédictions pour la valeur saisie par l'utilisateur à destination d'une liste de choix, d'une boîte de recherche ou d'une zone de texte. Elle indique également la façon dont les éventuelles prédictions seraient présentées.Element.ariaBusyDOMString qui reflète l'attribut aria-busy qui indique d'un élément est en train d'être modifié. Les technologies d'assistance peuvent alors faire le choix d'attendre la fin de la modification avant d'exposer le contenu à l'utilisateur.Element.ariaCheckedDOMString qui reflète l'attribut aria-checked indiquant l'état coché (ou non) des cases à cocher, des boutons radio ou des autres éléments d'interface graphique qui peuvent être cochés.Element.ariaColCountDOMString qui reflète l'attribut aria-colcount indiquant le nombre de colonnes d'un tableau, d'une grille ou d'une grille arborescente.Element.ariaColIndexDOMString qui reflète l'attribut aria-colindex qui définit l'indice de la colonne d'un élément ou sa position par rapport au nombre total de colonnes d'un tableau, d'une grille ou d'une grille arborescente.Element.ariaColIndexTextDOMString qui reflète l'attribut aria-colindextext qui définit texte alternatif à aria-colindex qui soit compréhensible par un humain.Element.ariaColSpanDOMString qui reflète l'attribut aria-colspan qui définit le nombre de colonnes sur lesquelles s'étend une cellule dans un tableau, une grille ou une grille arborescente.Element.ariaCurrentDOMString qui reflète l'attribut aria-current qui indique l'élément représente l'objet courant dans un conteneur ou un ensemble d'éléments.Element.ariaDescriptionDOMString qui reflète l'attribut aria-description qui définit la chaîne de caractères pour décrire ou annoter l'élément courant.Element.ariaDisabledDOMString qui reflète l'attribut aria-disabled qui indique que l'élément est perceptible mais désactivé et qu'il ne peut être édité ou manipulé.Element.ariaExpandedDOMString qui reflète l'attribut aria-expanded qui indique si un élément de groupement contrôlé par l'élément courant est développé ou replié.Element.ariaHasPopupDOMString qui reflète l'attribut aria-haspopup qui indique la disponibilité et le type d'élément interactif visuel comme un menu ou une boîte de dialogue pouvant être généré par l'élément courant.Element.ariaHiddenDOMString qui reflète l'attribut aria-hidden qui indique si l'élément est exposé à une API d'accessibilité.Element.ariaKeyShortcutsDOMString qui reflète l'attribut aria-keyshortcuts qui indique les raccourcis clavier implémentés spécifiquement pour activer ou fournir le focus à un élément.Element.ariaLabelDOMString qui reflète l'attribut aria-label qui définit une chaîne de caractères étant un libellé pour l'élément courant.Element.ariaLevelDOMString qui reflète l'attribut aria-level qui définit le niveau hiérarchique de l'élément au sein d'une structure.Element.ariaLiveDOMString qui reflète l'attribut aria-live qui indique que l'élément sera mis à jour et qui décrit les types de mises à jour qui peuvent être attendues par les agents utilisateur, les outils d'assistance et l'utilisateur.Element.ariaModalDOMString qui reflète l'attribut aria-modal qui indique si un élément est modal lorsqu'il est affiché.Element.ariaMultilineDOMString qui reflète l'attribut aria-multiline qui indique si une zone de texte accepte une saisie sur plusieurs lignes ou sur une seule ligne.Element.ariaMultiSelectableDOMString qui reflète l'attribut aria-multiselectable qui indique que la personne peut choisir plus d'un élément parmi les éléments descendants qui peuvent être sélectionnés.Element.ariaOrientationDOMString qui reflète l'attribut aria-orientation qui indique si l'orientation de l'élément est horizontale, verticale ou inconnue voire ambigüe.Element.ariaPlaceholderDOMString qui reflète l'attribut aria-placeholder qui définit une indication courte destinée à aider l'utilisateur à saisir une valeur lorsque le contrôle ne possède pas de valeur.Element.ariaPosInSetDOMString qui reflète l'attribut aria-posinset qui définit l'index ou la position de l'élément courant dans l'ensemble ou l'arbre d'éléments.Element.ariaPressedDOMString qui reflète l'attribut aria-pressed qui indique l'état actif/pressé des boutons.Element.ariaReadOnlyDOMString qui reflète l'attribut aria-readonly qui indique que l'élément ne peut pas être édité mais qu'il peut être utilisé sinon.Element.ariaRelevantDOMString qui reflète l'attribut aria-relevant qui indique les notifications qui seront déclenchées par l'agent utilisateur lorsque l'arbre d'accessibilité d'une région interactive sera modifié. Cette propriété est utilisée afin de décrire quels changements d'une région aria-live sont pertinents et devraient être annoncés.Element.ariaRequiredDOMString qui reflète l'attribut aria-required qui indique que la saisie d'une utilisatrice ou d'un utilisateur est requise sur l'élément avant qu'un formulaire puisse être envoyé.Element.ariaRoleDescriptionDOMString qui reflète l'attribut aria-roledescription qui définit une description compréhensible par un humain, adaptée par l'autrice ou l'auteur du document pour le rôle de l'élément courant.Element.ariaRowCountDOMString qui reflète l'attribut aria-rowcount qui définit le nombre total de lignes dans un tableau, une grille ou une grille arborescente.Element.ariaRowIndexDOMString qui reflète l'attribut aria-rowindex qui définit l'index ou la position de la ligne de l'élément par rapport au nombre total de lignes dans le tableau, la grille ou la grille arborescente.Element.ariaRowIndexTextDOMString qui reflète l'attribut aria-rowindextext qui définit un libellé alternatif à aria-rowindex, compréhensible par un humain.Element.ariaRowSpanDOMString qui reflète l'attribut aria-rowspan qui définit le nombre de lignes sur lesquelles s'étend une cellule dans un tableau, une grille ou une grille arborescente.Element.ariaSelectedDOMString qui reflète l'attribut aria-selected qui indique l'état de sélection pour les éléments qui peuvent être sélectionnés.Element.ariaSetSizeDOMString qui reflète l'attribut aria-setsize qui définit le nombre d'objets dans l'ensemble d'éléments d'une liste ou d'un arbre.Element.ariaSortDOMString qui reflète l'attribut aria-sort qui indique si les objets d'un tableau ou d'une grille sont triés par ordre croissant ou décroissant.Element.ariaValueMaxDOMString qui reflète l'attribut aria-valueMax qui définit la valeur maximale autorisée pour un élément d'interface utilisateur décrivant un intervalle.Element.ariaValueMinDOMString qui reflète l'attribut aria-valueMin qui définit la valeur minimale autorisée pour un élément d'interface utilisateur décrivant un intervalle.Element.ariaValueNowDOMString qui reflète l'attribut aria-valueNow qui définit la valeur courante d'un élément d'interface utilisateur décrivant un intervalle.Element.ariaValueTextDOMString qui reflète l'attribut aria-valuetext qui définit une alternative textuelle à aria-valuenow compréhensible par un humain.Element.onfullscreenchangefullscreenchange qui est envoyé lorsque l'élément passe en mode plein écran ou sort de celui-ci. Cet évènement peut être utilisé pour surveiller les transitions entre les deux modes mais aussi pour surveiller les modifications inattendues comme lorsque l'application s'exécute en arrière-plan.Element.onfullscreenerrorfullscreenerror qui est envoyé lorsqu'une erreur se produit lors du passage au mode plein écran.Element hérite des méthodes fournit par la classe parente Node et de sa classe parente avant elle : EventTarget.
EventTarget.addEventListener()Element.after()Node ou DOMString dans la liste des enfants du parent de l'élément courant, juste après ce dernier.Element.attachShadow()ShadowRoot.Element.animate() {{Experimental_Inline}}Animation créé.Element.append()Node ou DOMString après le dernier enfant de l'élément.Element.before()Node ou DOMString dans la liste des enfants du parent de l'élément courant, juste avant ce dernier.Element.closest()Element.createShadowRoot() {{Non-standard_Inline}} {{Deprecated_Inline}}ShadowRoot.Element.computedStyleMap() {{Experimental_Inline}}StylePropertyMapReadOnly qui fournit une représentation en lecture seule d'un bloc de déclaration CSS alternatif à CSSStyleDeclaration.EventTarget.dispatchEvent()Element.getAnimations() {{Experimental_Inline}}Animation actuellement actifs sur l'élément.Element.getAttribute()Element.getAttributeNames()Element.getAttributeNode()Attr.Element.getAttributeNodeNS()Attr.Element.getAttributeNS()Element.getBoundingClientRect()Element.getBoxQuads() {{experimental_inline}}DOMQuad qui représentent les fragments CSS pour le nœud.Element.getClientRects()Element.getElementsByClassName()HTMLCollection qui contient tous les descendants de l'élément courant et qui possèdent la liste de classes fournie en paramètre.Element.getElementsByTagName()HTMLCollection qui contient tous les descendants de l'élément courant avec un nom de balise donné.Element.getElementsByTagNameNS()HTMLCollection qui contient tous les descendants de l'élément courant qui ont un nom de balise et un espace de noms donnés.Element.hasAttribute()Element.hasAttributeNS()Element.hasAttributes()Element.hasPointerCapture()Element.insertAdjacentElement()Element.insertAdjacentHTML()Element.insertAdjacentText()Element.matches()Element.prepend()Node ou DOMString avant le premier enfant de l'élément courant.Element.querySelector()Node qui correspond au sélecteur donné, relatif à l'élément courant.Element.querySelectorAll()NodeList contenant les nœuds pour lesquels le sélecteur, passé en argument, relatif à l'élément courant.Element.releasePointerCapture()Element.remove()Element.removeAttribute()Element.removeAttributeNode()Element.removeAttributeNS()EventTarget.removeEventListener()Element.replaceChildren()Element.replaceWith()Node ou DOMString.Element.requestFullscreen() {{Experimental_Inline}}Element.requestPointerLock() {{Experimental_Inline}}Element.scroll()Element.scrollBy()Element.scrollIntoView() {{Experimental_Inline}}Element.scrollTo()Element.setAttribute()Element.setAttributeNode()Element.setAttributeNodeNS()Element.setAttributeNS()Element.setCapture() {{Non-standard_Inline}}{{Deprecated_Inline}}Element.setPointerCapture()Element.toggleAttribute()On peut écouter ces évènements en utilisant la méthode addEventListener() ou en affectant un gestionnaire d'évènement à la propriété onnomevenement de cette interface.
cancel<dialog> lorsque la personne indique au navigateur le souhait de fermer la boîte de dialogue courante. Un navigateur pourra par exemple déclencher cet évènement lors d'un appui sur la touche Echap ou lors d'un clic sur le bouton « Fermer cette boîte de dialogue » fourni par le navigateur. Également disponible via la propriété oncancel.erroronerror.scrollonscroll.selectonselect.showcontextmenu a été déclenché ou a bouillonné sur un élément qui dispose de l'attribut contextmenu attribute. {{deprecated_inline}} Également disponible via la propriété onshow.wheelonwheel.copyoncopy.cutoncut.pasteonpaste.compositionendcompositionstartcompositionupdatebluronblur.focusonfocus.focusinfocusoutfullscreenchangeonfullscreenchange.fullscreenerrorElement si une erreur se produit lors d'une transition (entrée ou sortie) pour le mode plein écran. Également disponible via la propriété onfullscreenerror.keydownonkeydown.keypressonkeypress.keyuponkeyup.auxclickonauxclick.clickonclick.contextmenuoncontextmenu.dblclickondblclick.DOMActivate {{Deprecated_Inline}}mousedownonmousedown.mouseenteronmouseenter.mouseleaveonmouseleave.mousemoveonmousemove.mouseoutonmouseout.mouseoveronmouseover.mouseuponmouseup.webkitmouseforcechangedwebkitmouseforcedownmousedown dès que suffisamment de pression a été appliquée pour qualifier ce clic de clic forcé.webkitmouseforcewillbeginmousedown.webkitmouseforceupwebkitmouseforcedown dès que suffisamment de pression a été relâchée pour terminer le clic forcé.touchcancelontouchcancel.touchendontouchend.touchmoveontouchmove.touchstartontouchstart.{{Specifications}}
{{Compat}}