EventTarget은 이벤트를 받고 그 이벤트 수신기(listener)를 가질 수 있는 객체에 의해 구현된 인터페이스입니다.

Element, documentwindow는 가장 흔한 이벤트 대상(target)이지만, 예를 들어 XMLHttpRequest, AudioNode, AudioContext 및 나머지 다른 객체들도 이벤트 대상이 될 수 있습니다.

많은 이벤트 대상(element, document 및 window 포함)도 on... property 및 attribute를 통해 이벤트 처리기 설정을 지원합니다.

메서드

EventTarget.addEventListener()
EventTarget에 특정 이벤트 유형의 이벤트 처리기를 등록.
EventTarget.removeEventListener()
EventTarget에서 이벤트 수신기를 제거.
EventTarget.dispatchEvent()
EventTarget에 이벤트를 디스패치.

Mozilla chrome 코드 용 추가 메서드

on* property를 구현하는 JS로 구현된 이벤트 대상에 쓰이는 Mozilla 확장기능(extension). WebIDL 바인딩도 참조.

  • void setEventHandler(DOMString type, EventHandler handler)
  • EventHandler getEventHandler(DOMString type)

예제

간단한 EventTarget 구현

var 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;
  }
  var stack = this.listeners[type];
  for(var i = 0, l = stack.length; i < l; i++){
     if(stack[i] === callback){
       stack.splice(i, 1);
       return this.removeEventListener(type, callback);
      }
     }
};

EventTarget.prototype.dispatchEvent = function(event){
  if(!(event.type in this.listeners)) {
    return;
  }
    var stack = this.listeners[event.type];
    event.target = this;
    for(var i = 0, l = stack.length; i < l; i++) {
        stack[i].call(this, event);
    }
};

명세

명세 상태 설명
DOM
The definition of 'EventTarget' in that specification.
Living Standard 변화 없음.
Document Object Model (DOM) Level 3 Events Specification
The definition of 'EventTarget' in that specification.
Obsolete 매개변수 약간이 이제 선택사항(listener) 또는 null 값을 받아들임(useCapture).
Document Object Model (DOM) Level 2 Events Specification
The definition of 'EventTarget' in that specification.
Obsolete 초기 정의.

브라우저 호환성

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
EventTargetChrome Full support 1Edge Full support YesFirefox Full support 1IE Full support 6Opera Full support 7Safari Full support 10.1
Full support 10.1
No support 1 — 10.1
Notes
Notes Window.EventTarget did not exist on versions of Safari before 10.1.
WebView Android Full support 1Chrome Android Full support 18Edge Mobile Full support YesFirefox Android Full support 4Opera Android Full support 10.1Safari iOS Full support 10.1
Full support 10.1
No support 1 — 10.1
Notes
Notes Window.EventTarget did not exist on versions of Safari iOS before 10.1.
Samsung Internet Android Full support Yes
EventTarget() constructorChrome Full support 64Edge ? Firefox Full support 59IE No support NoOpera Full support 51Safari No support NoWebView Android Full support 64Chrome Android Full support 64Edge Mobile ? Firefox Android Full support 59Opera Android Full support 47Safari iOS No support NoSamsung Internet Android No support No
addEventListenerChrome Full support 1
Notes
Full support 1
Notes
Notes Before Chrome 49, the type and listener parameters were optional.
Edge Full support 12Firefox Full support 1IE Full support 9
Full support 9
No support 6 — 11
Notes Alternate Name
Notes Older versions of IE supported an equivalent, proprietary EventTarget.attachEvent() method.
Alternate Name Uses the non-standard name: attachEvent
Opera Full support 7Safari Full support 1WebView Android Full support 1
Notes
Full support 1
Notes
Notes Before Chrome 49, the type and listener parameters were optional.
Chrome Android Full support 18
Notes
Full support 18
Notes
Notes Before Chrome 49, the type and listener parameters were optional.
Edge Mobile Full support YesFirefox Android Full support 4Opera Android Full support 10.1Safari iOS Full support 1Samsung Internet Android Full support Yes
dispatchEventChrome Full support 4Edge Full support 12Firefox Full support 2IE Full support 9
Full support 9
No support 6 — 11
Notes Alternate Name
Notes Older versions of IE supported an equivalent, proprietary EventTarget.fireEvent() method.
Alternate Name Uses the non-standard name: fireEvent
Opera Full support 9Safari Full support 3.2WebView Android Full support 4Chrome Android Full support 18Edge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
removeEventListenerChrome Full support 1Edge Full support 12Firefox Full support 1IE Full support 9
Full support 9
No support 6 — 11
Notes Alternate Name
Notes Older versions of IE supported an equivalent, proprietary EventTarget.detachEvent() method.
Alternate Name Uses the non-standard name: detachEvent
Opera Full support 7Safari Full support 1WebView Android Full support 1Chrome Android Full support 18Edge Mobile Full support YesFirefox Android Full support 4Opera Android Full support 10.1Safari iOS Full support 1Samsung Internet Android Full support Yes

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
See implementation notes.
See implementation notes.
Uses a non-standard name.
Uses a non-standard name.

같이 보기

문서 태그 및 공헌자

이 페이지의 공헌자: alattalatta, mdnwebdocs-bot, Netaras, wbamberg
최종 변경자: alattalatta,