DOM Events

List of all events:

https://developer.mozilla.org/en-US/docs/Web/Events

Create

let eventTarget = document.getElementById('targetElement');
 
eventTarget.addEventListener('click', function() {
  // code
});



// THIS IS THE BETTER WAY OF DOING IT
// becuase you can remove it
function eventHandlerFunction() {
  // code
}
 
eventTarget.addEventListener('click', eventHandlerFunction);




//////
// can only work with one function
eventTarget.onclick = eventHandlerFunction;

Delete

eventTarget.removeEventListener('click', eventHandlerFunction);

Event Object

function eventHandlerFunction(event){
	// access information on the event here
	// event.timeStamp = time passed in ms since doc was loaded
	// event.type
	// event.target = elemnt that event is registered to
	event.target.innerHTML = 'hello';
}
 
eventTarget.addEventListener('click', eventHandlerFunction);