Quick solution to conflicts between jQuery and other libraries

Source: Internet
Author: User

Generally, when jQuery and other libraries are used on the same page, the definition of global name $ is the biggest debate and conflict. As we all know, jQuery uses $ as the alias of jQuery name and applies it to every function exposed by jQuery. However, Prototype is the most famous among other libraries and $ name is also used.

1.JQuery provides the $. noConflict () utility to discard the usage of $ identifiers so that other libraries can use it.

The syntax of this function is as follows:
$. NoConflict (jqueryToo)

Return control of identifier $ to other libraries, allowing jQuery to be used together with other libraries on the page. Once this function is executed, you must use the jQuery identifier instead of the $ identifier to call the jQuery function,

You can also discard the jQuery identifier (optional)

This method should be called after jQuery is included, but not before conflicting libraries are included.


Although the jQuery identifier is used, because $ is the alias of jQuery, all jQuery functions are still available after $. noConflict () is applied. We can define shorter but non-conflicting jQuery aliases, such

Var $ j = jQuery;

2.Another common practice is to create a scope environment in which $ identifiers point to jQuery objects. This is a common technique when extending jQuery, especially for plug-in authors, they cannot determine whether the page developer has called $. noConflict () makes any assumptions, and of course it cannot be called by itself to avoid damaging the wishes of page developers,

The usage is as follows:
(Function ($) {}) (jQuery );
(Function ($ ){})

This part declares a function and enclose it in parentheses to generate an expression. The result of this expression is a reference to an anonymous function, this function expects to pass in a single parameter and name it $. In the function body, you can use the $ identifier to reference anything that is passed to this function. Because the parameter declaration takes precedence over any similar name identifier in the global scope, any $ value defined outside the function will be replaced by input parameters in the function.

(JQuery)

Execute a function call on an anonymous function and pass the jQuery object as a parameter.


No matter whether the $ identifier is defined in Prototype or other libraries, it always points to the jQuery object in the function.

When using this technique, $ declared externally is not available in the function body.

3.A variant of the second usage is often used to declare ready processing functions, thus forming the third syntax,
JQuery (function ($ ){
})

When you write reusable components that may be used on a page that has $. noConflict () used, it is best to take this precaution against the $ definition.

Related Article

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.