Cómo crear funciones propias de jQuery

¿Necesitas definir funciones nativas de jQuery para que estén disponibles en todos los elementos o selectores? ¿Te pica la curiosidad? Es algo sencillo y polivalente, descubramos cómo crear funciones propias de jQuery.

Por ejemplo, pongamos que quiero hacer una función llamada loading() que muestre un icono animado de carga en cualquier elemento.

Cómo crear funciones propias de jQuery

Definimos nuestra función dentro del listado de funciones de jQuery:

jQuery.fn.loading = function() { 
  $(this[0]).html("<img src='loading.gif'>"); 
};

Observa que this[0] es el primer elemento al que se invoca en la función, pero this es un array de elementos.

Si quieres que la función trabaje sobre una lista de elementos, no filtres el primero, déjalo en $(this).

Uso

$("#contenido").loading();