We're looking for a person or people to help audit MDN to find places we could speed up. Is this you or someone you know? Check out the RFP: https://mzl.la/2IHcMiE

The EventListener interface represents an object that can handle an event dispatched by an EventTarget object.

Due to the need for compatibility with legacy content, EventListener accepts both a function and an object with a handleEvent property function. This is shown in the example below.


This interface neither implements, nor inherits, any properties.


This interface doesn't inherit any methods.

A function that is called whenever an event of the specified type occurs.



<button id="btn">Click here!</button>


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

// Add a handler for the 'click' event by providing a callback function.
// Whenever the element is clicked, a pop-up with "Element clicked!" will
// appear.
buttonElement.addEventListener('click', function (event) {
  alert('Element clicked through function!');

// For compatibility, a non-function object with a `handleEvent` property is
// treated just the same as a function itself.
buttonElement.addEventListener('click', {
  handleEvent: function (event) {
    alert('Element clicked through handleEvent property!');



Specification Status Comment
The definition of 'EventListener' in that specification.
Living Standard No change.
Document Object Model (DOM) Level 2 Events Specification
The definition of 'EventListener' in that specification.
Obsolete Initial definition.

Document Tags and Contributors

 Contributors to this page: TimothyGu, Makyen, Sheppy, teoli, iamanupmenon
 Last updated by: TimothyGu,