element

  • Raccourci de la révision : DOM/element
  • Titre de la révision : element
  • ID de la révision : 116120
  • Créé :
  • Créateur : Mgjbot
  • Version actuelle ? Non
  • Commentaire robot Ajoute: zh-cn

Contenu de la révision

{{template.DomRef()}}

Introduction

Ce chapitre fournit une brève référence des méthodes, propriétés et évènements disponibles pour tous les élements HTML et XML au sein du DOM des navigateurs utilisant Gecko.

Ces interfaces DOM sont réparties sur les différents niveaux de spécification du DOM, mais font pour la plupart partie de la recommandation DOM Level 2. Chaque membre fournit un lien vers sa définition dans les spécifications DOM du W3C.

Ici, le mot « éléments » se réfère à l'interface que tous les éléments HTML et XML ont en commun depuis le DOM. Des interfaces plus spécialisées existent pour des objets particuliers, par exemple l'élément BODY qui dispose de fonctions et propriétés supplémentaires, ou encore les tableaux. Mais ce chapitre ne concerne que les interfaces partagées par tous les éléments.

Propriétés

attributes
Renvoie une collection des attributs de l'élément.
childNodes
Renvoie une liste des nœuds enfants de l'élément.
className
Définit ou obtient la classe de l'élément.
clientHeight
La hauteur intérieure d'un élément.
clientLeft
Distance entre la propriété offsetLeft d'un élément et le bord gauche de la zone de visualisation.
clientTop
Distance entre la propriété offsetTop d'un élément et le bord supérieur de la zone de visualisation.
clientWidth
La largeur intérieure d'un élément.
dir
Renvoie/définit le sens d'écriture d'un élément.
firstChild
Renvoie le premier enfant direct du nœud.
id
Définit ou obtient l'identifiant (id) de l'élément courant.
innerHTML
Renvoie l'ensemble du balisage et du texte contenu au sein d'un élément donné.
lang
Specifies the base language of an element's attribute values and text content.
lastChild
Renvoie le dernier élément enfant d'un noeud.
length
Renvoie le nombre d'éléments dans une liste/collection d'éléments (ex: childNodes).
localName
localName returns the local part of the qualified name of this node.
namespaceURI
The namespace URI of this node, or null if it is unspecified.
nextSibling
Renvoie le nœud suivant immédiatement celui donné dans l'arbre.
nodeName
Renvoie le nom du noeud.
nodeType
Renvoie le type du noeud.
nodeValue
Renvoie la valeur du noeud.
offsetHeight
Renvoie la hauteur d'un élément relative à son élément parent.
offsetLeft
Retourne le nombre de pixels (axe horizontal) d'un élément depuis son propre bord gauche jusqu'au bord gauche de l'élément parent (offsetParent) (x=0 correspond au bord gauche de l'élément parent). Lecture seule
offsetParent
Retourne la référence d'un objet dont l'élément courant est l'enfant (Renvoie l'objet conteneur).
offsetTop
Retourne le nombre de pixels (axe vertical) d'un élément depuis son bord haut jusqu'au bord haut de l'élément parent (offsetParent) (y=0 correspond au bord supérieur de l'élément parent). Lecture seule
offsetWidth
Returns the width of an element relative to the layout.
ownerDocument
Returns the document in which this node appears.
parentNode
Returns the parent node of the element.
prefix
Returns the namespace prefix of the current node, or null if it is unspecified.
previousSibling
Returns the node immediately previous to the given one in the tree.
scrollHeight
Returns the height of the scroll view of an element.
scrollLeft
Gets/sets the distance between the left of an element and the leftmost portion of its content currently visible.
scrollTop
Gets/sets the distance between the top of an element and the topmost portion of its content currently visible.
scrollWidth
Returns the width of the scroll view of an element.
style
style returns the block of style rules on the current element.
tabIndex
Gets/sets the position of the element in the tabbing order.
tagName
Returns the name of the tag for given element.
textContent
Gets/sets the text content of an element including its descendants.

Méthodes

addEventListener
Allows the registration of event listeners on the event target.
appendChild
Insère le nœud spécifié au sein de la liste de nœuds du document courant.
blur
Removes keyboard focus from the current element.
click
Simulates a click on the current element.
cloneNode
Returns a duplicate of the current node.
dispatchEvent
Allows the dispatch of events into the implementation's event model.
focus
Sets focus on the current element.
getAttribute
Returns the value of the named attribute on the current node.
getAttributeNS
Returns the value of the attribute with the given name and namespace.
getAttributeNode
Returns the attribute of the current element as a separate node.
getAttributeNodeNS
A namespace-aware version of getAttributeNode
getElementsByTagName
Renvoie les éléments portant un nom particulier et faisant partie des enfants de l'élément courant.
hasAttribute
Returns a boolean value indicating whether the current element has the specified attribute or not.
hasAttributeNS
Returns a boolean value indicating whether the current element has an attribute with the specified name and namespace.
hasAttributes
Returns a boolean value indicating whether the current element has any attributes.
hasChildNodes
Returns a boolean value indicating whether the current element has children or not.
insertBefore
Inserts a node before the current element in the DOM.
item
Retrieves a node from the tree by index.
normalize
Puts the current node and all of its subtree into a "normalized" form (see below).
removeAttribute
Removes an attribute from the element.
removeAttributeNS
Removes the attribute with specified name and namespace from the element.
removeAttributeNode
Removes the specified attribute from the element.
removeChild
Removes a child node from the current element.
removeEventListener
Removes an event listener from the element.
replaceChild
Replaces one child node on the current element with another.
setAttribute
Adds a new attribute or changes the value of an existing attribute on the current element.
setAttributeNS
Adds a new attribute or changes the value of an attribute with the given namespace and name.
setAttributeNode
Adds a new attribute node to the current element.
setAttributeNodeNS
Adds a new attribute node with the specified namespace and name.
supports
Tests if this DOM implementation supports a particular feature.

Évènements

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

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
Returns the event handling code for the blur event.
onclick
Returns the event handling code for the click event.
ondblclick
Returns the event handling code for the dblclick event.
onfocus
Returns the event handling code for the focus event.
onkeydown
Returns the event handling code for the keydown event.
onkeypress
Returns the event handling code for the keypress event.
onkeyup
Returns the event handling code for the keyup event.
onmousedown
Returns the event handling code for the mousedown event.
onmousemove
Returns the event handling code for the mousemove event.
onmouseout
Returns the event handling code for the mouseout event.
onmouseover
Returns the event handling code for the mouseover event.
onmouseup
Returns the event handling code for the mouseup event.
onresize
Returns the event handling code for the resize event.
{{ wiki.languages( { "en": "en/DOM/element", "pl": "pl/DOM/element", "zh-cn": "cn/DOM/element" } ) }}

Source de la révision

<p>
{{template.DomRef()}}
</p>
<h3 name="Introduction"> Introduction </h3>
<p>Ce chapitre fournit une brève référence des méthodes, propriétés et évènements disponibles pour tous les élements HTML et XML au sein du DOM des navigateurs utilisant Gecko.
</p><p>Ces interfaces DOM sont réparties sur les différents niveaux de spécification du DOM, mais font pour la plupart partie de la recommandation DOM Level 2. Chaque membre fournit un lien vers sa définition dans les spécifications DOM du W3C.
</p><p>Ici, le mot « éléments » se réfère à l'interface que tous les éléments HTML et XML ont en commun depuis le DOM. Des interfaces plus spécialisées existent pour des objets particuliers, par exemple l'élément BODY qui dispose de fonctions et propriétés supplémentaires, ou encore les tableaux. Mais ce chapitre ne concerne que les interfaces partagées par tous les éléments.
</p>
<h3 name="Propri.C3.A9t.C3.A9s"> Propriétés </h3>
<dl><dt> <a href="fr/DOM/element.attributes">attributes</a>
</dt><dd> Renvoie une collection des attributs de l'élément.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.childNodes">childNodes</a>
</dt><dd> Renvoie une liste des nœuds enfants de l'élément.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.className">className</a>
</dt><dd> Définit ou obtient la classe de l'élément.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.clientHeight">clientHeight</a>
</dt><dd> La hauteur intérieure d'un élément.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.clientLeft">clientLeft</a>
</dt><dd> Distance entre la propriété offsetLeft d'un élément et le bord gauche de la zone de visualisation.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.clientTop">clientTop</a>
</dt><dd> Distance entre la propriété offsetTop d'un élément et le bord supérieur de la zone de visualisation.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.clientWidth">clientWidth</a>
</dt><dd> La largeur intérieure d'un élément.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.dir">dir</a>
</dt><dd> Renvoie/définit le sens d'écriture d'un élément.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.firstChild">firstChild</a>
</dt><dd> Renvoie le premier enfant direct du nœud.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.id">id</a>
</dt><dd> Définit ou obtient l'identifiant (id) de l'élément courant.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.innerHTML">innerHTML</a>
</dt><dd> Renvoie l'ensemble du balisage et du texte contenu au sein d'un élément donné.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.lang">lang</a>
</dt><dd> Specifies the base language of an element's attribute values and text content.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.lastChild">lastChild</a>
</dt><dd> Renvoie le dernier élément enfant d'un noeud.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.length">length</a>
</dt><dd> Renvoie le nombre d'éléments dans une liste/collection d'éléments (ex: childNodes).
</dd></dl>
<dl><dt> <a href="fr/DOM/element.localName">localName</a>
</dt><dd> localName returns the local part of the qualified name of this node.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.namespaceURI">namespaceURI</a>
</dt><dd> The namespace URI of this node, or <code>null</code> if it is unspecified.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.nextSibling">nextSibling</a>
</dt><dd> Renvoie le nœud suivant immédiatement celui donné dans l'arbre.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.nodeName">nodeName</a>
</dt><dd> Renvoie le nom du noeud.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.nodeType">nodeType</a>
</dt><dd> Renvoie le type du noeud.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.nodeValue">nodeValue</a>
</dt><dd> Renvoie la valeur du noeud.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.offsetHeight">offsetHeight</a>
</dt><dd> Renvoie la hauteur d'un élément relative à son élément parent.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.offsetLeft">offsetLeft</a>
</dt><dd> Retourne le nombre de pixels (axe horizontal) d'un élément depuis son propre bord gauche jusqu'au bord gauche de l'élément parent (<code>offsetParent</code>) (x=0 correspond au bord gauche de l'élément parent). Lecture seule
</dd></dl>
<dl><dt> <a href="fr/DOM/element.offsetParent">offsetParent</a>
</dt><dd> Retourne la référence d'un objet dont l'élément courant est l'enfant (Renvoie l'objet conteneur).
</dd></dl>
<dl><dt> <a href="fr/DOM/element.offsetTop">offsetTop</a>
</dt><dd> Retourne le nombre de pixels (axe vertical) d'un élément depuis son bord haut jusqu'au bord haut de l'élément parent (<code>offsetParent</code>) (y=0 correspond au bord supérieur de l'élément parent). Lecture seule
</dd></dl>
<dl><dt> <a href="fr/DOM/element.offsetWidth">offsetWidth</a>
</dt><dd> Returns the width of an element relative to the layout.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.ownerDocument">ownerDocument</a>
</dt><dd> Returns the document in which this node appears.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.parentNode">parentNode</a>
</dt><dd> Returns the parent node of the element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.prefix">prefix</a>
</dt><dd> Returns the namespace prefix of the current node, or <code>null</code> if it is unspecified.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.previousSibling">previousSibling</a>
</dt><dd> Returns the node immediately previous to the given one in the tree.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.scrollHeight">scrollHeight</a>
</dt><dd> Returns the height of the scroll view of an element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.scrollLeft">scrollLeft</a>
</dt><dd> Gets/sets the distance between the left of an element and the leftmost portion of its content currently visible.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.scrollTop">scrollTop</a>
</dt><dd> Gets/sets the distance between the top of an element and the topmost portion of its content currently visible.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.scrollWidth">scrollWidth</a>
</dt><dd> Returns the width of the scroll view of an element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.style">style</a>
</dt><dd> style returns the block of style rules on the current element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.tabIndex">tabIndex</a>
</dt><dd> Gets/sets the position of the element in the tabbing order.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.tagName">tagName</a>
</dt><dd> Returns the name of the tag for given element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.textContent">textContent</a>
</dt><dd> Gets/sets the text content of an element including its descendants.
</dd></dl>
<h3 name="M.C3.A9thodes"> Méthodes </h3>
<dl><dt> <a href="fr/DOM/element.addEventListener">addEventListener</a>
</dt><dd> Allows the registration of event listeners on the event target.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.appendChild">appendChild</a>
</dt><dd> Insère le nœud spécifié au sein de la liste de nœuds du document courant.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.blur">blur</a>
</dt><dd> Removes keyboard focus from the current element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.click">click</a>
</dt><dd> Simulates a click on the current element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.cloneNode">cloneNode</a>
</dt><dd> Returns a duplicate of the current node.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.dispatchEvent">dispatchEvent</a>
</dt><dd> Allows the dispatch of events into the implementation's event model.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.focus">focus</a>
</dt><dd> Sets focus on the current element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.getAttribute">getAttribute</a>
</dt><dd> Returns the value of the named attribute on the current node.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.getAttributeNS">getAttributeNS</a>
</dt><dd> Returns the value of the attribute with the given name and namespace.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.getAttributeNode">getAttributeNode</a>
</dt><dd> Returns the attribute of the current element as a separate node.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.getAttributeNodeNS">getAttributeNodeNS</a>
</dt><dd> A namespace-aware version of <code>getAttributeNode</code>
</dd></dl>
<dl><dt> <a href="fr/DOM/element.getElementsByTagName">getElementsByTagName</a>
</dt><dd> Renvoie les éléments portant un nom particulier et faisant partie des enfants de l'élément courant.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.hasAttribute">hasAttribute</a>
</dt><dd> Returns a boolean value indicating whether the current element has the specified attribute or not.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.hasAttributeNS">hasAttributeNS</a>
</dt><dd> Returns a boolean value indicating whether the current element has an attribute with the specified name and namespace.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.hasAttributes">hasAttributes</a>
</dt><dd> Returns a boolean value indicating whether the current element has any attributes.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.hasChildNodes">hasChildNodes</a>
</dt><dd> Returns a boolean value indicating whether the current element has children or not.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.insertBefore">insertBefore</a>
</dt><dd> Inserts a node before the current element in the DOM.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.item">item</a>
</dt><dd> Retrieves a node from the tree by index.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.normalize">normalize</a>
</dt><dd> Puts the current node and all of its subtree into a "normalized" form (see below).
</dd></dl>
<dl><dt> <a href="fr/DOM/element.removeAttribute">removeAttribute</a>
</dt><dd> Removes an attribute from the element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.removeAttributeNS">removeAttributeNS</a>
</dt><dd> Removes the attribute with specified name and namespace from the element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.removeAttributeNode">removeAttributeNode</a>
</dt><dd> Removes the specified attribute from the element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.removeChild">removeChild</a>
</dt><dd> Removes a child node from the current element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.removeEventListener">removeEventListener</a>
</dt><dd> Removes an event listener from the element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.replaceChild">replaceChild</a>
</dt><dd> Replaces one child node on the current element with another.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.setAttribute">setAttribute</a>
</dt><dd> Adds a new attribute or changes the value of an existing attribute on the current element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.setAttributeNS">setAttributeNS</a>
</dt><dd> Adds a new attribute or changes the value of an attribute with the given namespace and name.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.setAttributeNode">setAttributeNode</a>
</dt><dd> Adds a new attribute node to the current element.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.setAttributeNodeNS">setAttributeNodeNS</a>
</dt><dd> Adds a new attribute node with the specified namespace and name.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.supports">supports</a>
</dt><dd> Tests if this DOM implementation supports a particular feature.
</dd></dl>
<h3 name=".C3.89v.C3.A8nements"> Évènements </h3>
<p>Ce sont des propriétés qui correspondent aux attributs d'évènements HTML.
</p><p>Contrairement aux attributs correspondants, les valeurs de ces propriétés sont des fonctions (ou tout autre objet implémentant l'interface <b>EventListener</b>) 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 :
</p>
<pre>&lt;div onclick="foo();"&gt;cliquez ici&lt;/div&gt;
</pre>
<p>Si <code>element</code> est une référence vers cet élément <code>div</code>, la valeur de <code>element.onclick</code> sera :
</p>
<pre>function onclick(event) {
  foo();
}
</pre>
<p>Notez la façon dont l'objet <a href="fr/DOM/event">event</a> est passé comme paramètre <code>event</code> à cette fonction enveloppante.
</p>
<dl><dt> <a href="fr/DOM/element.onblur">onblur</a>
</dt><dd> Returns the event handling code for the blur event.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.onclick">onclick</a>
</dt><dd> Returns the event handling code for the click event.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.ondblclick">ondblclick</a>
</dt><dd> Returns the event handling code for the dblclick event.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.onfocus">onfocus</a>
</dt><dd> Returns the event handling code for the focus event.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.onkeydown">onkeydown</a>
</dt><dd> Returns the event handling code for the keydown event.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.onkeypress">onkeypress</a>
</dt><dd> Returns the event handling code for the keypress event.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.onkeyup">onkeyup</a>
</dt><dd> Returns the event handling code for the keyup event.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.onmousedown">onmousedown</a>
</dt><dd> Returns the event handling code for the mousedown event.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.onmousemove">onmousemove</a>
</dt><dd> Returns the event handling code for the mousemove event.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.onmouseout">onmouseout</a>
</dt><dd> Returns the event handling code for the mouseout event.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.onmouseover">onmouseover</a>
</dt><dd> Returns the event handling code for the mouseover event.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.onmouseup">onmouseup</a>
</dt><dd> Returns the event handling code for the mouseup event.
</dd></dl>
<dl><dt> <a href="fr/DOM/element.onresize">onresize</a>
</dt><dd> Returns the event handling code for the resize event.
</dd></dl>
{{ wiki.languages( { "en": "en/DOM/element", "pl": "pl/DOM/element", "zh-cn": "cn/DOM/element" } ) }}
Revenir à cette révision