0

I am new to the DOM and I am console logging things so I can see what my code is doing to my website without implementing it right away.

I have read the documentation about console.log and console.dir

I am confused because I am using VS code and sometimes my console.log() behaves as a console.dir() when I am looking at the chrome console.

This is frustrating me because to check if an attribute I am creating is working as I want it to, I have to scroll down all the properties to find the one I want.

For an example, if I am logging a variable xyz that is a div with a class of test.

input --> console.log(xyz)

output --> div.test

the output has a drop down with all the possible properties of div... many of them null. If I scroll down to className it says test so I know it worked correctly

How do I get it so it shows

This would make everything I do much faster

It does this sometimes but if I refresh it reverts back to that JSON like tree

CherryDT
  • 25,571
  • 5
  • 49
  • 74
jbans
  • 1
  • Why not use the developer tools in the browser? – Ryan Wilson Oct 04 '21 at 19:11
  • You could always log what you actually want (`console.log(xyz.classList.contains('test')`)... – Heretic Monkey Oct 04 '21 at 19:11
  • It makes a difference whether the devtools were open while a line was logged or they are opened after the fact. – CherryDT Oct 04 '21 at 19:12
  • @CherryDT so you are both saying there is no way to standardize the output from Vs Code? It does work if I type it directly into the developer tools... I guess I am lazy and want to just console log it from VS code. – jbans Oct 04 '21 at 21:01

0 Answers0