What's the difference between a jQuery object and a DOM element? Difference between .get() and .index()?

Question

I\'m lead to this question when trying to figure out the difference between jQuery\'s .get() and .index(), I\'ve looked over the jQuery API and I s

Answer 1

I know this is not an explaination as such - others have done a pretty good job here. But I think visuals can tell you a whole lot more.

Get Safari/Chrome (with their developer menus) or Firefox with firebug and have a look at how these web programming tools visually represent the things you want to know about.

For example the DOM "Document Object Model" says it all but you won't understand the relationship between the objects (elements) in the document (html page) unless you consider it as a hierarchy. These toold allow you to navigate that hierarchy in a sensible visual way.

Likewise they also contain evaluation tools which allow you to type in the name of the javascript object to see what it contains.

Once you've played around with this you'll get the idea of what is a document object, and a javascript object.

To answer the question however .get() gets the element and allows you to interact with it directly without having to navigate the DOM hierarchy programatically, whilst .index(), just finds the index of it's position within the hierarchy