SyntaxStudy
Sign Up
Home JavaScript Reference addEventListener()

addEventListener()

method

Attaches an event handler to an element. Preferred over inline handlers.

Syntax

element.addEventListener(event, callback, options)

Example

javascript
const btn = document.querySelector('#myBtn');

// Click event
btn.addEventListener('click', (e) => {
    console.log('Clicked!', e.target);
});

// With options
btn.addEventListener('click', handleClick, { once: true }); // fires once

// Form submit
document.querySelector('form').addEventListener('submit', (e) => {
    e.preventDefault();
    console.log('Form submitted');
});

// Keyboard
document.addEventListener('keydown', (e) => {
    if (e.key === 'Escape') closeModal();
});