Soy nuevo en el DOM y estoy registrando cosas en la consola para poder ver qué está haciendo mi código en mi sitio web sin implementarlo de inmediato.

He leído la documentación sobre console.log y console.dir

Estoy confundido porque estoy usando el código VS y, a veces, mi console.log() se comporta como un console.dir() cuando miro la consola de Chrome.

Esto me frustra porque para verificar si un atributo que estoy creando funciona como quiero, tengo que desplazarme hacia abajo por todas las propiedades para encontrar el que quiero.

Por ejemplo, si estoy registrando una variable xyz que es un div con una clase de prueba.

entrada --> consola.log(xyz)

salida --> div.prueba

la salida tiene un menú desplegable con todas las posibles propiedades de div... muchas de ellas nulas. Si me desplazo hacia abajo hasta className, dice prueba, así que sé que funcionó correctamente

como lo consigo para que se muestre

Esto haría que todo lo que hago sea mucho más rápido.

A veces hace esto, pero si actualizo, vuelve a ese árbol tipo JSON