document.getElementById() keeps returning NULL - how to find value

Question

I am using one of those vulnerable practice sites on Kali Linux and when I inspected the source page I noticed the following variable var pathName = document.getElementById("path") The value of pathName is hidden and it is up to me to find it as these sites are there for people to practice their ethical hack skills

So in the Chrome Web Browser console, I type in document.getElementById("path").value but I keep getting return null . I don't understand why, like do I need to do like window.ontop ?

Any help would be great!

Answer 1

If document.getElementById("path").value returns null, your element was found. It might not be an input element, so might not contain a value field.

Try typing JSON.stringify(document.getElementById("path")) into the console to inspect the object.

Also try document.getElementById("path").outerHTML to see the attributes and children.

Or just document.getElementById("path") and open the tree to view the internals.

Answer 2

Make you sure you have an input in DOM with id="path" attribute value.

For example - <input id="path">

If that is not present in the DOM then getElementById will always return null.

You can open Chrome-Dev Tool and search this #path in Elements tab. That should highlight that input, if it is not then you are targeting wrong element.