Examining a single DOM element returned in a jQuery object

This is a continuation of a previous question.

I have: var X = $('p');

I'm trying to display on the page itself, what exactly is X[0]. If I use:

JSON.stringify(X)

It tells me that there's an object there, with a constructor, but not much else. For a DOM element, like X[0] in this example, how do I display what exactly this object is?

I can loop through X.each and display the html, but there's so much more to a DOM element than the html. There's all the attributes that are inherited. There's probably a leng开发者_JAVA技巧th property... I don't know.

---

Update: Now I see. I suggest to have a look at Firebug Light. It embeds Firebug in any website. Maybe this helps you to figure out how to simulate console.log.

Or maybe just use it itself?

---

Use console.log(X) (reps. console.log(X[0])) . It is either available directly in Webkit (Chrome, Safari) or via Firebug for Firefox (don't know about IE or Opera, sorry).

JSON.stringify does not work, because you cannot serialize DOM elements (due to their recursive structure).

---

You can inspect the properties of a native DOM element in the DOM subtab of the HTML tab in Firebug.

---

JavaScript is a prototype-based language. Rather than viewing the class the object was instantiated from you would inspect it's prototype.

X.prototype //reveals where it inherits all of its core methods/properties.

You can also loop through it's properties.

for(var prop in X) {
  //more props.
}

---

the eq function returns one jQuery element from a list

  $('p').eq(0);

the get function returns the HTML element

  $('p').get(0);