First, the method of jquery plug-in development
There are two main ways to write jquery plugins:
1. Plug-ins based on jquery objects
2, based on the jquery class plug-in
Second, the jquery-based plug-in
1, what is the jquery class plug-in?
The jquery class method is actually the jquery global function, the method of the JQuery object, which is actually the inner function in the jquery namespace. One feature of these functions is that they do not manipulate DOM elements, but rather manipulate JavaScript non-element objects. The intuitive understanding is to add a class method to the jquery class, which can be understood as adding a static method
2. Add a method to the jquery class.
// add two global functions function () { Console.log ("This is foo"); Jquery.foo (); // This is foo function ( ) { Console.log ("This is Bar")}; Jquery.bar (); // This is bar
3. Using the Jquery.extend () function
jquery customizes the Jquery.extend () and JQuery.fn.extend () methods, Jquery.extend () can create tool functions or selectors, and jQuery.fn.extend () can create JQuery object commands.
Use the Jquery.extend () function
Jquery.extend ({ foo:function() { Console.log ("This is foo"); }, bar: function() { Console.log ("This is Bar") }, }); $.foo (); // This is foo $.bar (); // This is bar
4. Using namespaces
While it is forbidden to use a large number of JavaScript function names and variable names in the jquery namespace, it is still inevitable that some functions or variable names will conflict with other jquery plug-ins, so it is customary to encapsulate some methods into another custom namespace.
// using Namespaces = { foo:function() { Console.log (' This is Foo ');}, Bar: function () { Console.log (' This is Bar '); } ; $.myplugin.foo (); $.myplugin.bar ();
jquery Plugin Development (i): jquery class method