How to traverse dom dot notation with a div element with an id

I would like to traverse the dom with just dot notation

e.g. document.body

Under body I have a div with id mydiv. I know about querySelector() or getElementById() but that’s not my question. I simply want to open the JS console and using dot notation drill down into elements using dot notation.

document.body.#mydiv # doesnt work

Would like the console to return #mydiv with the ability to expand and look at it in Chrome

Answer

For an element with id you can always use below in console

$('#myDiv');

or

$$('#myDiv')

This will show that element in console, from there you can see all details of that element.

This should also work with any selector

eg: Try below in this page

$$('.user-details')

You will see something like this

enter image description here

Leave a Reply

Your email address will not be published. Required fields are marked *