7

I am reading JavaScript and JQuery, The Missing Manual

and they start of with this Snippet : 

$(document).ready(function(){});

I know that function(){} is an anonymous function, and that document is an object with properties I can set / read, and that ready() is a JQuery function defined in the library, but I don't know what the rest of the syntax is for and it is not explained in the book.

Particularly,

$(document)

Can someone explain what this does or point me to a link? Also, someone said that you can identify JQuery by this alone, is this true?

Kev
  • 118,037
  • 53
  • 300
  • 385
  • 5
    You should try google, it will point you to http://api.jquery.com/ready/ – jrummell Mar 26 '12 at 18:17
  • 1
    `$` is a reference to `window.jQuery`, which is a function that is overloaded with various types of behavior depending on what it is passed. –  Mar 26 '12 at 18:18
  • 2
    i do not think someone who wants to break down the guts of statement that most people overlook deserves downvotes... – jbabey Mar 26 '12 at 18:20
  • 1
    I agree. I upvoted his question. It's a logical question that deserves to be answered with _tact & fact_ – Ohgodwhy Mar 26 '12 at 18:22
  • 2
    possible duplicate of [What is the meaning of "$" sign in javascript](http://stackoverflow.com/questions/1150381/what-is-the-meaning-of-sign-in-javascript) – JJJ Mar 26 '12 at 18:22
  • It seems from the documentation that jQuery is a function..so that $(document) is a function as well...can someone verify? –  Mar 26 '12 at 18:26
  • 2
    Regarding your update... *"Is jQuery() a function or an object?"*, it's both. Functions in JavaScript are a type of Object. But what's happening in this case is that you're calling the function, and it's creating and returning a new object that references `document` at property `0` of that object. That returned Object has *(in its prototype chain)* a set of methods that can be invoked and will usually effect whatever elements you gave it. Oddly enough, in the case of the `.ready()` method, the `document` is actually ignored. –  Mar 26 '12 at 18:26
  • And that it "references document at property 0 of that object" is determined by syntax or the internal contents of the jQuery() function/object? –  Mar 26 '12 at 18:29
  • 1
    @GuyMontag: Entirely by the internal construct of the function. The actual function itself is very simple. It just calls a different internal constructor function. That's where all the work is done. When you pass it an element *(or a set of elements)*, those elements are added to the object that is constructed, at numeric indices starting at `0`. –  Mar 26 '12 at 18:32
  • 1
    @GuyMontag: You're welcome. If you're interested in seeing how it works, [here's a link](https://github.com/jquery/jquery/blob/1.7.1/src/core.js#L4-7) to the code for the `jQuery` function. You'll see that it just returns the result of calling another function, but with the `new` keyword. The `new` makes the other function behave as a constructor. The code for the other *(constructor)* function [is here](https://github.com/jquery/jquery/blob/1.7.1/src/core.js#L78-186). –  Mar 26 '12 at 18:36

7 Answers7

4

$(document) wraps a jQuery instance around the document object. ($ is just an alias for jQuery.) So the return value of $(document) is a jQuery instance, which has a ready function on it.

T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
2

It is a synonym for the jquery() function:

http://api.jquery.com/jQuery/

Sky Kelsey
  • 19,192
  • 5
  • 36
  • 77
  • So that document is the argument to jquery() and ready() acts upon the return type from jquery()? Is this correct? –  Mar 26 '12 at 18:19
  • @GuyMontag: document is an argument to jQuery() and ready() is an event handler (a method of jQuery) which accepts a callback function as a parameter. – T. Junghans Mar 26 '12 at 18:25
1

$ is a shortcut for the JQuery object. All methods in the jQuery library are part of the jQuery object.

$(selector) is the same as writing 'jQuery(selector)`

charlietfl
  • 170,828
  • 13
  • 121
  • 150
1

the $ before jquery statements is to differentiate between standard javascript and jquery. But other frameworks can use the dollar sign as well, so sometimes you will see jQuery(document) so as not to conflict. It can also be set to anything really, even $jq, etc. All it is doing is telling your code to use the framework functions instead of standard javascript.

user1289347
  • 2,397
  • 1
  • 13
  • 16
1

The $ is a synonym for jQuery and what that does is described here: http://api.jquery.com/jQuery/

T. Junghans
  • 11,385
  • 7
  • 52
  • 75
1

$ is an alias (short-hand) for the variable jQuery which is the blanket object that stores all jQuery functions.

$(document) is taking your current window.document (the window. part is often omitted when accessing window properties) and passing it to the jQuery constructor $(), and then attaching an event handler to the ready event, which executes the anonymous function passed as a callback.

jbabey
  • 45,965
  • 12
  • 71
  • 94
  • According to http://api.jquery.com/jQuery/ jQuery is a function, are you sure it is an object? –  Mar 26 '12 at 18:22
  • In javascript a function is also an object, a [Function object](https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function). – T. Junghans Mar 26 '12 at 18:27
  • @GuyMontag everything in javascript is an object. – jbabey Mar 26 '12 at 18:29
-3

$ is just a selector for jquery. You're pretty much saying that what follows after "$" is part of the jquery library.

Be careful because some other javascript libraries use that same selector.

Eric Strom
  • 715
  • 9
  • 20