DOM/eventObject.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Event Object</title>
  </head>
  <body>
    <h1 class="title">Event Object</h1>
    <p>
      All event objects in the DOM are based on the Event Object. Therefore, all
      other event objects (like MouseEvent and KeyboardEvent) has access to the
      Event Object's properties and methods. (W3Schools)
    </p>
    <button id="btn">Click Me</button>
    <script>
      const title = document.querySelector(".title");
      const btn = document.getElementById("btn");
      btn.onclick = function () {
        btn.innerHTML = "Clicked";
        console.log(event);
        console.log(event.target); //	Returns the element that triggered the event
        console.log(event.type); //! Returns the name of the event
      };
    </script>
  </body>
</html>