JavaScript's jquery library plug-in's brief development guide _jquery

JQuery plug-ins are usually divided into two categories.

1. Selector based plug-ins (support for chained operations)
2. Plugins that are not based on selectors (chained operations are not supported)

Some time ago a simple study of the JQuery plug-in development, the development of two simple plug-ins, the two types of plug-ins in this development model to do a brief summary.
Selector-based Plug-ins

Typically the development pattern is as follows:

(Function ($, window, undefined) {
 $.fn. Pluginname = function (opts) {
 var defaults = {
  //Plugin Custom option default value
 };

 Override default options with user's custom options
 var options = $.extend (defaults, opts | | {});

 Return This.each (function () {//Let the plugin support chained operations
  //write plug-in function code here
 });
(JQuery, window);

First, you create an anonymous self execution function with the parameters $, window, and undefined, and the arguments are jQuery and window.

Well? Why didn't you pass in an argument for undefined? This is a small trick, considering that the variable name may be undefined elsewhere in the JavaScript code, losing its real meaning, so simply not passing this argument here to make sure it is the real undefined in that anonymous self execution function.

When jquery is passed in, it corresponds to $, which guarantees that the $ that is called within the plug-in must be a library of jquery rather than Prototype.

This type of plug-in is typically called $ (selector). Pluginname (); This form.

Examples of this type can be referred to Https://github.com/libuchao/KTwitter
plugins that are not based on selectors

Since such plug-ins are not dependent on selectors, there is no chain operation. The general development model is as follows:

(Function ($, window, undefined) {
 $. Pluginname = function (opts) {
 var defaults = {
  //Plugin Custom option default value
 };

 Override default options with user's custom options
 var options = $.extend (defaults, opts | | {});

 Write plug-in function code here
 };
(JQuery, window);

This type of plug-in is typically called $ (selector). Pluginname (); This form.