Lo que sucede es que la propiedad
style, además de establecer valores para las distintas propiedades CSS, devuelve los estilos del elemento pero establecidos
inline, es decir, mediante el atributo
style="propiedad:valor". La primera vez que pulsas al elemento, lo que se obtiene es una cadena vacía para
dom.style.display puesto que no estableciste ningún valor
inline para dicha propiedad, entonces, por la condición que pones, se asignar el valor "none". La segunda vez que pulsas al elemento, ya se estableció el valor
inline, por lo tanto, se cumple la condición y se asigna el valor "block".
Para obtener el valor definido en la hoja de estilos, puedes utilizar el método
.getComputedStyle(). Y para obtener compatibilidad con navegadores antiguos, puedes utilizar
esta función.
Un saludo