4

I am too curious to know the difference between $ and $.fn? Can anyone please explain this to me in details? Also what is $.fn?

palaѕн
  • 72,112
  • 17
  • 116
  • 136
  • 1
    Duplicate with http://stackoverflow.com/questions/4083351/what-does-jquery-fn-mean? – Samuel Caillerie Nov 28 '12 at 11:32
  • did you look at http://stackoverflow.com/questions/2845981/jquery-difference-between-functionname-and-fn-functionname ? If it doen't respond tell why ! – Emmanuel Gleizer Nov 28 '12 at 11:33
  • Before post a question, have a look at the documentation references in the [tag info](http://stackoverflow.com/tags/jquery/info). – Alberto De Caro Nov 28 '12 at 11:44
  • @EmmanuelGleizer: Yes, I did saw that, but I am looking forward to some explanation with examples/demos which are simple to understand by a layman! Hope you got my point. – palaѕн Nov 28 '12 at 12:04
  • Does this answer your question? [What does jQuery.fn mean?](https://stackoverflow.com/questions/4083351/what-does-jquery-fn-mean) – Sire Oct 05 '21 at 07:48

3 Answers3

9

$ is a function (specifically, a variable pointing to the jQuery function — an alias). $.fn is a property on that function, which points to the prototype of the internal init function jQuery uses to create instances, as we can see in the jQuery code:

jQuery.fn.init.prototype = jQuery.fn;

(That's line 289 of the current un-minified jQuery file, v1.8.3.)

$.fn is there so that it's easy to add properties to it. When you create jQuery objects, they have those properties, because of JavaScript's prototypical inheritance. The most common properties to add to it are, of course, functions that do things (jQuery plug-ins).

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

$.fn is the object containing all $() functions ($ prototype). So if you define a function on $.fn, every jQuery collection created with $() will have access to your function. jQuery plugins are created using this method, for example:

definition:

$.fn.myPlugin = function(){...}

usage:

$(selector).myPlugin();

Yshayy
  • 325
  • 2
  • 10
1

The fn property is an alias to the prototype property.

The jQuery identifier (or $) is just a constructor function, and all instances created with it, inherit from the constructor's prototype.

See question: What does jQuery.fn mean? for a detailed example

Community
  • 1
  • 1
ajtrichards
  • 29,723
  • 13
  • 94
  • 101