Fundamentos de jQuery

4.6. Evitar conflictos con otras bibliotecas JavaScript

Si esta utilizando jQuery en conjunto con otras bibliotecas JavaScript, las cuales también utilizan la variable $, pueden llegar a ocurrir una serie de errores. Para poder solucionarlos, es necesario poner a jQuery en su modo "no-conflicto". Esto se debe realizar inmediatamente después que jQuery se cargue en la página y antes del código que se va a ejecutar.

Cuando se pone a jQuery en modo "no-conflicto", la biblioteca ofrece la opción de asignar un nombre para reemplazar a la variable $.

Poner a jQuery en modo no-conflicto

// la biblioteca prototype también utiliza $
<script src="prototype.js"></script>

// se carga jquery en la página
<script src="jquery.js"></script>

// se inicializa el modo "no-conflicto"
<script>var $j = jQuery.noConflict();</script>

También es posible seguir utilizando $ conteniendo el código en una función anónima autoejecutable. éste es un patrón estándar para la creación de extensiones para la biblioteca, ya que $ queda encerrada dentro del alcance de la misma función anónima.

Utilizar $ dentro de una función anónima autoejecutable

<script src="prototype.js"></script>
<script src="jquery.js"></script>
<script>
jQuery.noConflict();

(function($) {
   // el código va aquí, pudiendo utilizar $
})(jQuery);
</script>