Event Listeners, Event Object

Please click on this link to access the resource folder for this lesson.

• Listeners can be attached to Dom elements, and will fire if the event happens
• You can use addEventListener to assign multiple event handlers to an element
• removeEventListener can be used to remove an event listener from an element

• Using event handlers, you cannot attach more than one handler to an attribute. The fundamental problem of the aforementioned ways to assign handlers – we can’t assign multiple handlers to one event.
• Developers of web standards understood that long ago and suggested an alternative way of managing handlers using special methods addEventListener and removeEventListener. They are free of such a problem.

• When an event happens, the browser creates an event object, puts details into it and passes it as an argument to the handler.
• Some properties of the event object are:  event.id, event.type, event.name etc. See full list here

• To properly handle an event we’d want to know more about what’s happened. Not just a “click” or a “keydown”, but what were the pointer coordinates? Which key was pressed? And so on.
• When an event happens, the browser creates an event object, puts details into it and passes it as an argument to the handler.