JavaScript - differences between onclick and addEventListener

In this article, we would like to show you the differences between onclick and addEventListener in JavaScript.

• with onclick you can't attach multiple events to the same element,

• you can't add event handlers from different places in your code because you can only attach one event handler,

• someone else may overwrite your event elsewhere in the code,

• With addEventListener you can attach multiple events to the same element,
• you can add event handling functions from different places in your code even for the same event,
• the event can't be overwritten elsewhere in the code (new event handler will be added to the same event),
• if you want to remove events that were added using addEventListener you must always have a handle to the function that was added with the addEventListener.