Selecting DOM elements in Chrome console

By default, when logging a DOM node in Chrome, it displays as markup. To log the DOM node as a normal object use console.dir. The reason d3.select("#para") shows as a normal object is that this method probably doesn't return a DOM node, but an object that wraps over the DOM node.

console.dir(document.getElementById("para"));

The best method in my opinion is this:

  • open the chrome console
  • type: $x("//input[@id='para']")

With a click on the found element you can also see it selected