How to get a reference to node in DOM tree in Google Chrome debugger console
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 browse开发者_如何学编程r 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.
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.
A fairly good solution is to pick the desired element from the array returned by getElementsByTagName
.
精彩评论