jquery Plugin Development (i): jquery class method

Source: Internet
Author: User

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

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.