diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/fr/web/api/eventtarget/index.html | |
parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip |
initial commit
Diffstat (limited to 'files/fr/web/api/eventtarget/index.html')
-rw-r--r-- | files/fr/web/api/eventtarget/index.html | 138 |
1 files changed, 138 insertions, 0 deletions
diff --git a/files/fr/web/api/eventtarget/index.html b/files/fr/web/api/eventtarget/index.html new file mode 100644 index 0000000000..cfef429c5f --- /dev/null +++ b/files/fr/web/api/eventtarget/index.html @@ -0,0 +1,138 @@ +--- +title: EventTarget +slug: Web/API/EventTarget +tags: + - API + - Cible de l'événement + - DOM + - DOM Events + - EventTarget + - Interface + - Événements DOM +translation_of: Web/API/EventTarget +--- +<nav>{{ApiRef("DOM Events")}}</nav> + +<p><span class="seoSummary"><code>EventTarget</code> est une interface DOM implémentée par des objets qui peuvent recevoir des événements et peuvent avoir des écouteurs pour eux.</span></p> + +<p>{{domxref ("Element")}}, {{domxref ("Document")}} et {{domxref ("Window")}} sont les cibles d'événements les plus fréquentes, mais d'autres objets peuvent également être des cibles d'événements. Par exemple {{domxref ("XMLHttpRequest")}}, {{domxref ("AudioNode")}}, {{domxref ("AudioContext")}} et autres.</p> + +<p>De nombreuses cibles d'événements (y compris des éléments, des documents et des fenêtres) supporte également la définition de <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Guide/DOM/Events/Event_handlers">gestionnaires d'événements</a> via les propriétés et attributs <code>onevent</code>.</p> + +<p>{{InheritanceDiagram}}</p> + +<h2 id="Constructeur">Constructeur</h2> + +<dl> + <dt>{{domxref("EventTarget.EventTarget()", "EventTarget()")}}</dt> + <dd>Crée une nouvelle instance d'objet <code>EventTarget</code>.</dd> +</dl> + +<h2 id="Méthodes">Méthodes</h2> + +<dl> + <dt>{{domxref("EventTarget.addEventListener()", "<var>EventTarget</var>.addEventListener()")}}</dt> + <dd>Enregistre un gestionnaire d'événements d'un type d'événement spécifique sur <code>EventTarget</code>.</dd> + <dt>{{domxref("EventTarget.removeEventListener()", "<var>EventTarget</var>.removeEventListener()")}}</dt> + <dd>Supprime un écouteur d'événement de <code>EventTarget</code>.</dd> + <dt>{{domxref("EventTarget.dispatchEvent()", "<var>EventTarget</var>.dispatchEvent()")}}</dt> + <dd>Envoie un événement à cet <code>EventTarget</code>.</dd> +</dl> + +<h3 id="Méthodes_supplémentaires_dans_la_base_de_code_Chrome_de_Mozilla">Méthodes supplémentaires dans la base de code Chrome de Mozilla</h3> + +<p>Mozilla inclut quelques extensions à utiliser par les cibles d'événements implémentées par JS pour implémenter les propriétés <code>onevent</code>.</p> + +<p>Voir aussi <a href="https://wiki.developer.mozilla.org/en-US/docs/Mozilla/WebIDL_bindings">liaisons WebIDL</a>.</p> + +<ul> + <li><code>void <strong>setEventHandler</strong>(DOMString <var>type</var>, EventHandler <var>handler</var>)</code> {{non-standard_inline}}</li> + <li><code>EventHandler <strong>getEventHandler</strong>(DOMString <var>type</var>)</code> {{non-standard_inline}}</li> +</ul> + +<h2 id="Exemple">Exemple</h2> + +<h3 id="Implémentation_simple_dEventTarget">Implémentation simple d'EventTarget</h3> + +<pre class="brush: js notranslate">const EventTarget = function () { + this.listeners = {} +} + +EventTarget.prototype.listeners = null +EventTarget.prototype.addEventListener = function (type, callback) { + if (!(type in this.listeners)) { + this.listeners[type] = [] + } + this.listeners[type].push(callback) +} + +EventTarget.prototype.removeEventListener = function (type, callback) { + if (!(type in this.listeners)) { + return + } + const stack = this.listeners[type] + for (let i = 0, l = stack.length; i < l; i++) { + if (stack[i] === callback) { + stack.splice(i, 1) + return + } + } +} + +EventTarget.prototype.dispatchEvent = function (event) { + if (!(event.type in this.listeners)) { + return true + } + const stack = this.listeners[event.type].slice() + + for (let i = 0, l = stack.length; i < l; i++) { + stack[i].call(this, event) + } + return !event.defaultPrevented +} +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('DOM WHATWG', '#interface-eventtarget', 'EventTarget')}}</td> + <td>{{Spec2('DOM WHATWG')}}</td> + <td>Pas de changement.</td> + </tr> + <tr> + <td>{{SpecName('DOM3 Events', 'DOM3-Events.html#interface-EventTarget', 'EventTarget')}}</td> + <td>{{Spec2('DOM3 Events')}}</td> + <td>Quelques paramètres sont désormais optionnels (<code>listener</code>), ou acceptent la valeur nulle (<code>useCapture</code>).</td> + </tr> + <tr> + <td>{{SpecName('DOM2 Events', 'events.html#Events-EventTarget', 'EventTarget')}}</td> + <td>{{Spec2('DOM2 Events')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et nous envoyer une pull request.</div> + +<p>{{Compat("api.EventTarget")}}</p> +</div> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Reference/Events">Référence d'événement</a> - les événements disponibles sur la plateforme.</li> + <li> <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Guide/DOM/Events">Guide du développeur d'événements</a></li> + <li>{{domxref("Event")}} interface</li> +</ul> |