JQuery $ () - what does it return, and what is $ () [0]?

Question

I am considering an example of using jqGrid, which is a jQuery plugin.

It draws a grid in a div with a list id.

He creates a grid with $('#list').jqGrid(...).

But he fills the grid $('#list')[0].addJSONData(...).

I have been browsing the web pages for jQuery tutorials, trying to understand the difference, and I have not found anything that concerns me as the most fundamental question in its use.

What returns $()? Does a jquery object containing a DOM element return? Does a jquery object containing an array of DOM elements return? Does it return a DOM element to which additional jQuery functions are added?

And then what $()[0]? If I $()returned a jQuery object containing an array of DOM elements, I would expect it to be a div with id 'list', but addJSONDatanot a DOM method, this is a jqGrid method. Is jqGrid this method for all DOM elements in an array?

===== ADDED ======

If $ () returns a jquery object that contains an attribute of DOM objects, why does $ () [0] refer to an object that contains the addJSONData method? addJSONData is not a DOM method, it is a jqGrid method.

Answer 1

$()returns a set of elements based on a selector. Therefore, it $('.help')returns all elements with a class .help. $('.help')[0]will give you the first item.

Answer 2

$() jquery, css jQuery, $ jQuery, .. jQuery() $() .

$()[0] non jQuery, , $('#someId')[0], getElementById('someId');

Answer 3

$() jQuery(). jQuery , . , $() [0] DOM.

jQuery.

Answer 4

jQuery DOM. $('#list') ( , ) , '#list'.

Answer 5

$ () returns a jQuery object containing a set of matched elements. Indexing into a jQuery object via $ () [0] returns the first consistent DOM object.

var docWrappedInJQuery = $('document');
var bareDoc = $('document')[0];
assert((document === docWrappedInJQuery) === false);
assert((document === bareDoc) === true);

Answer 6

$()matches the call jQuery(). The documentation is here: http://api.jquery.com/jQuery/

Remember that a call $(function() { })is a shortcut to a call.$(document).ready(function() { });