EventListener

EventListener 인터페이스는 EventTarget 객체로부터 발생한 이벤트를  처리하기 위한 오브젝트를 말합니다.

속성

이 인터페이스는 구현체나, 상속, 속성 어떤것도 갖고 있지 않습니다.

메소드

이 인터페이스는 어떤 메소드도 상속받지 않습니다.

EventListener.handleEvent()

주어진 타입의 이벤트가 발생할 때마다 호출될 함수입니다.

예제

HTML

<button id="btn">여기를 눌러보세요!</button>

JavaScript

const buttonElement = document.getElementById('btn');

// 콜백 함수를 제공함으로써 '클릭' 이벤트를 처리하는 핸들러를 추가합니다.
// 엘리먼트가 클릭될 떄마다, "누름!" 팝업이 나타날것입니다.
buttonElement.addEventListener('click', function (event) {
  alert('누름!');
});

// 호환성을 위해서, 함수가 아닌 `handleEvent` 속성을 가진 오브젝트도
// 똑같이 처리됩니다.
buttonElement.addEventListener('click', {
  handleEvent: function (event) {
    alert('handleEvent 함수로 누름!');
  }
});

Result

Specifications

Browser compatibility