How to get a link to a node in the DOM tree in the console of the Google Chrome debugger

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

If the element has id, it document.getElementByIdworks, but if there is no identifier, is there a better alternative to XPath or manual traversal of the DOM tree with children?

In case XPath is the best way, there is 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 every time.

+3
source share
2 answers

If any element was selected in the Elements panel, you can work with its properties in the console using the special variable $ 0.

+8
source

A pretty good solution is to select the desired element from the array returned getElementsByTagName.

0
source

Source: https://habr.com/ru/post/1733847/


All Articles