jQuery Evitar las colisiones entre espacios de nombres.


Ejemplo

Las bibliotecas que no sean jQuery también pueden usar $ como alias. Esto puede causar interferencia entre esas bibliotecas y jQuery.

Para liberar $ para usar con otras bibliotecas:

jQuery.noConflict();

Después de llamar a esta función, $ ya no es un alias para jQuery . Sin embargo, aún puede usar la variable jQuery para acceder a las funciones de jQuery:

jQuery('#hello').text('Hello, World!');

Opcionalmente, puede asignar una variable diferente como un alias para jQuery:

var jqy = jQuery.noConflict();
jqy('#hello').text('Hello, World!');

A la inversa, para evitar que otras bibliotecas interfieran con jQuery, puede ajustar su código jQuery en una expresión de función invocada de inmediato (IIFE) y pasar jQuery como argumento:

(function($) {
    $(document).ready(function() {
        $('#hello').text('Hello, World!');
    });
})(jQuery);

Dentro de este IIFE, $ es un alias solo para jQuery.

Otra forma sencilla de asegurar el alias $ de jQuery y asegurarse de que DOM esté listo :

jQuery(function( $ ) { // DOM is ready
   // You're now free to use $ alias
   $('#hello').text('Hello, World!');
});

Para resumir,

  • jQuery.noConflict() : $ ya no se refiere a jQuery, mientras que la variable jQuery hace.
  • var jQuery2 = jQuery.noConflict() - $ ya no hace referencia a jQuery, mientras que la variable jQuery hace y la variable jQuery2 .

Ahora, existe un tercer escenario: ¿qué jQuery2 si queremos que jQuery esté disponible solo en jQuery2 ? Utilizar,

var jQuery2 = jQuery.noConflict(true)

Esto da como resultado que ni $ ni jQuery refieran a jQuery.

Esto es útil cuando se deben cargar varias versiones de jQuery en la misma página.

<script src='https://code.jquery.com/jquery-1.12.4.min.js'></script>
<script>
    var jQuery1 = jQuery.noConflict(true);
</script>
<script src='https://code.jquery.com/jquery-3.1.0.min.js'></script>
<script>
    // Here, jQuery1 refers to jQuery 1.12.4 while, $ and jQuery refers to jQuery 3.1.0.
</script>

https://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/