JS DOM: 20. Event

by istiq20

HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Event</title>
  </head>
  <body>
    <h1 id="text">Click Yellow Box</h1>
    <div
      id="canvas"
      style="width: 500px; height: 500px; background-color: yellow"
    ></div>

    <script>
      const canvas = document.getElementById("canvas");
      const text = document.getElementById("text");

      canvas.onclick = function (event) {
        text.textContent = `You click at (${event.x}, ${event.y})`;
      };
    </script>
  </body>
</html>