JavaScript Events
Common Events
click,dblclickmouseover/mouseoutkeydown/keyupinput/changesubmitload,scroll,resize
addEventListener
element.addEventListener('event', callback)
click, dblclickmouseover / mouseoutkeydown / keyupinput / changesubmitload, scroll, resizeelement.addEventListener('event', callback)
document.getElementById('nameInput').addEventListener('input', function(e) {
document.getElementById('greeting').textContent = e.target.value ? 'Hello, '+e.target.value+'! 👋' : '';
});
const box = document.getElementById('mouseBox');
box.addEventListener('mouseover', function(){ this.style.background='#6DD5C4'; this.style.color='white'; });
box.addEventListener('mouseout', function(){ this.style.background='#EEF2FF'; this.style.color='#1e293b'; });
box.addEventListener('click', function(){ this.textContent='Clicked! 🎉'; document.getElementById('eventLog').textContent='Event: click'; });