To produce navigable trees from any Javascript object, use ๐ฐ๐ผ๐ป๐๐ผ๐น๐ฒ.๐ฑ๐ถ๐ฟ. You will get an interactive list of all object properties.
One nice thing about this method is that it can handle DOM elements too. So instead of getting the original HTML elements, you get a JSON representation of the object, as you can see in the snap below how different the document object looks with ๐ฐ๐ผ๐ป๐๐ผ๐น๐ฒ.๐ฑ๐ถ๐ฟ as opposed to ๐ฐ๐ผ๐ป๐๐ผ๐น๐ฒ.๐น๐ผ๐ด.
It takes a second object parameter with these options:
1- ๐ฑ๐ฒ๐ฝ๐๐ต => set it to null if you want to cover all levels recursively.
2- ๐ฐ๐ผ๐น๐ผ๐ฟ๐
3- ๐๐ต๐ผ๐๐๐ถ๐ฑ๐ฑ๐ฒ๐ป => shows non-enumerable keys and Symbols.
If you have an XML/HTML element, then use ๐ฐ๐ผ๐ป๐๐ผ๐น๐ฒ.๐ฑ๐ถ๐ฟ๐ ๐บ๐น instead.
Note that you could also use ๐ฑ๐ถ๐ฟ and ๐ฑ๐ถ๐ฟ๐ ๐บ๐น directly without the need for the ๐ฐ๐ผ๐ป๐๐ผ๐น๐ฒ object.
Follow for more tips :)
Top comments (0)