6

Could someone take the effort to explain me the difference between $ and $() in jquery?

I know $() is shorthand form of $jQuery() which takes any DOM element and turns it into a jQuery object.

But what I am not sure of is what is $ and how different is it from $(). Kindly enlighten me.

Thanks heaps, Chaitanya

Chaitanya MSV
  • 6,706
  • 12
  • 40
  • 46

6 Answers6

20

$ is a function that can be called - $().

The behaviour of $() varies immensely depending on the parameters supplied, although all examples below will return a jQuery object. It can:

  1. register a document.ready handler - $(myfunc)
  2. act as a selector - $('#myid')
  3. construct elements - $('<div>')
  4. return an empty object - $()

$ is also an object that contains various utility functions $.each, etc as properties of that object. In this context, it acts like a namespace for those functions.

Alnitak
  • 334,560
  • 70
  • 407
  • 495
6

$ = jQuery - This is the jQuery object which is used for the jQuery Utilies it contains such as $.Ajax() or $.each() Thus var j = $; will assign the jquery prototype into the variable j.

$() = jQuery() - This is a function called from the root jQuery object that is used convert DOM elements to jQuery Objects or get jQuery objects using selectors

secretformula
  • 6,414
  • 3
  • 33
  • 56
4

Hope this helps and add on to the other posts :)

  • $ = is a a valid javascript object/identifier.

  • $() = calling $() creates an empty jQuery object.

jQuery() — which can also be written as $() — searches through the DOM for any elements that match the provided selector and creates a new jQuery object that references these elements:

Official Document Please read docs here (click me) I would highly recommend that you should read this document.

Your question is mix of 2 sperate questions please see below:

Community
  • 1
  • 1
Tats_innit
  • 33,991
  • 10
  • 71
  • 77
  • here we go again.... ;-) please 1. trim those quotes to only include _relevant_ text 2. provide new useful content, not just links to other answers. Those links could be _comments_, not an answer... – Alnitak Jul 03 '12 at 11:25
  • @Alnitak Any suggestions to improve please! :-) With your experience I am honored if you can mentor, no kidding at all, I won't call you bruv this time sorry for that :) **a** I will remove spaces, **b** anything extra of some kind ? – Tats_innit Jul 03 '12 at 11:26
  • oh, and use the blockquote `>` character, not code indent! ;-) – Alnitak Jul 03 '12 at 11:28
  • @Alnitak Cool made few changes, thank-you! Stackoverflow and guys like you make is awesomeness :P to be around! cheers! feel free to let me know I am happy to put extra work and improve anything or take yur suggestion onboard! – Tats_innit Jul 03 '12 at 11:44
2

If i create a function:

function my_function() { alert('my_function'); return(33) }

my_function is a variable that contains a function. my_function() is the result of the function call.

You would use the function call my_function() to execute the instructions in the function and/or to get the returned result into a variable var my_var = my_function();.

You would use the variable name of the function in order to pass it to another function as a parameter such as $('a').click(my_function);

Since in JavaScript variables can be of any kind that includes scalar (literal values), arrays, objects and functions.

Now taking that idea and building on it:

$ is just a variable name just as jQuery is just a variable name.

As it so happens this variable contains a function which means that $() or jQuery() executes what ever instructions are present in the function body $.

Mihai Stancu
  • 15,848
  • 2
  • 33
  • 51
0

$ is a reference to the jQuery namespace, via which you can access its static methods (e.g. ajax, each etc), while $() calls a function that either registers a DOM-ready callback (if a function is passed to it) or returns elements from the DOM (if a selector string or element is passed to it).

Incidentally, $ is short-hand for jQuery, not $jQuery.

Mitya
  • 33,629
  • 9
  • 60
  • 107
0

In Javascript, everything is data, this includes function. As a contrived example:

function test() {
  console.log("test");
}

For this example, test() is the invocation of the function. Simply using test is like using a variable which allows you to do something like:

var t = test;
t();

Which then causes t to have the same data/functionality as test.

This then allows you to do something like a closure:

function closure() {
  var i = 0;
  function inner() {
    i++;
    console.log(i);
  }

  return inner;
}

Since a function is just some data, we can return it and then invoke it. So you would then write something like:

var t = closure();
t(); // prints '1'
t(); // prints '2'

Among other benefits, doing this allows you to keep your namespace a bit less cluttered.

To directly answer your question, $ is just an alias for jQuery which was made by doing:

function jQuery() { /* Lots of code */ }
$ = jQuery;