EventTarget
EventTarget
est une interface DOM implémentée par des objets qui peuvent recevoir des événements et peuvent avoir des écouteurs pour eux.
Element
, Document
et 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 XMLHttpRequest
, AudioNode
, AudioContext
et autres.
De nombreuses cibles d'événements (y compris des éléments, des documents et des fenêtres) supporte également la définition de gestionnaires d'événements via les propriétés et attributs onevent
.
Constructeur
EventTarget()
-
Crée une nouvelle instance d'objet
EventTarget
.
Méthodes
EventTarget.addEventListener()
-
Enregistre un gestionnaire d'événements d'un type d'événement spécifique sur
EventTarget
. EventTarget.removeEventListener()
-
Supprime un écouteur d'événement de
EventTarget
. EventTarget.dispatchEvent()
-
Envoie un événement à cet
EventTarget
.
Méthodes supplémentaires dans la base de code Chrome de Mozilla
Mozilla inclut quelques extensions à utiliser par les cibles d'événements implémentées par JS pour implémenter les propriétés onevent
.
Voir aussi liaisons WebIDL.
void setEventHandler(DOMString type, EventHandler handler)
Non-standardEventHandler getEventHandler(DOMString type)
Non-standard
Exemple
Implémentation simple d'EventTarget
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;
};
Spécifications
Specification |
---|
DOM Standard # interface-eventtarget |
Compatiblité des navigateurs
BCD tables only load in the browser
Voir aussi
- Référence d'événement - les événements disponibles sur la plateforme.
- Guide du développeur d'événements
Event
interface