Event.target | Dom

 

Descripción

La propiedad Event.target hace referencia al objeto que lanzó el evento y nos permite acceder al interface de dicho evento. Por ejemplo podremos acceder al identificador del objeto mediante su valor id.

Sintaxis

Event.target

Objeto Padre

Event

Ejemplo

<!DOCTYPE html>
<html lang="es">
<head>
	<title>Evento una sola vez</title>
</head>
<body>
  <h1>Evento una sola vez</h1>

  <form>
      <label for="elegido">El elegido: </label>
      <input id="elegido" type="text"/>
  </form>

  Solo me puedes elegir una vez:<br>
  <button id="uno">Uno</button>
  <button id="dos">Dos</button>
  <button id="tres">Tres</button>

  <script>

    const elegido = document.getElementById("elegido");
    const b1 = document.getElementById("uno");
    const b2 = document.getElementById("dos");
    const b3 = document.getElementById("tres");

    const controlador = {
      handleEvent: function(ev) {
        elegido.value = ev.target.id;
      }
    }

    b1.addEventListener("click",controlador, { once: true });
    b2.addEventListener("click",controlador, { once: true });
    b3.addEventListener("click",controlador, { once: true });

  </script>

</body>
</html>

Artículos