views:

220

answers:

2

In the Google Chrome debugger, I often want to get a reference to a node in the DOM tree. I can click the "magnifying glass" button and then click the desired element in the browser window to select the corresponding node in the DOM tree displayed in the debugger. But how can I get a reference to that node in the console?

If the element has an id, document.getElementById works, but if there is no id, is there a better alternative to XPath or manual traversal of the DOM tree using children?

In case XPath is the best way, is there a better way than doing something like this:

var evaluator = new XPathEvaluator();
var result = evaluator.evaluate("//div", document.documentElement, null,
             XPathResult.FIRST_ORDERED_NODE_TYPE, null);

which is a pain to type out each time.

A: 

A fairly good solution is to pick the desired element from the array returned by getElementsByTagName.

+2  A: 

If some element has been selected in Elements panel then you can work with it's properties in console with help of special variable $0.

loislo
That is sweet, handy to know.
Kinlan
Exactly what I wanted, thanks.