Skip to content

Week 3 Day 3

New Terms

  • HTML Events
  • OnEvents
  • EventListener

HTML Events

An HTML event is any action or occurrence detected by the browser that can be responded to using JavaScript. Events happen when users interact with elements on a webpage, such as clicking a button, hovering over an image, or submitting a form.

Common HTML Event

  • click – Triggered when an element is clicked
  • mouseover – Fires when the mouse pointer hovers over an element
  • keydown – Activates when a key is pressed
  • submit – Occurs when a form is submitted
  • load – Fires when a webpage or an image fully loads

OnEvents

OnEvents, commonly referred to as inline event handlers, are attributes that are directly added to HTML elements to specify JavaScript code that should run when an event occurs. These attributes begin with the prefix "on," followed by the specific event name, such as onclick, onmouseover, or onkeydown.

EventListener

The EventListener method in JavaScript provides a powerful way to handle events dynamically by attaching event-handling functions to HTML elements. Unlike OnEvents, which define event behavior directly within HTML attributes, EventListener allows developers to add multiple event handlers to a single element, enhancing flexibility and modularity. The addEventListener method is the most common approach, taking two primary arguments: the event type (such as click, mouseover, or keydown) and the function to execute when the event occurs.