Digamos que necesito un botón que pueda cambiar de estilo cuando ocurre el evento mousedown , y recuperar su estilo normal cuando se activa el evento mouseup .

Lo que estoy tratando de hacer es almacenar en caché los viejos estilos CSS en el controlador de eventos mousedown , para que puedan estar disponibles para el controlador de eventos mouseup (Son demasiados, no quiero configurarlos uno por uno).

Pero como muestra el siguiente código, cuando el navegador devuelve la llamada a mi detector de eventos, me pasa un objeto de botón sin ninguna propiedad de estilo css.

Mi pregunta es: ¿me perdí algo? ¿O simplemente se supone que debe ser así? Si este es el caso, ¿cómo puedo obtener sus propiedades de estilo css cuando javascript selecciona un elemento DOM?

 let show = function(key) { console.log(key.style.backgroundColor); // should be red }; const btn = document.querySelector('.button'); btn.addEventListener('click', () => { show(btn); });

 .button { width: 100px; height: 40px; background-color: red; }

 <button class="button">Click me to show "red"</button>