Hasta este momento ya hemos publicado varios artículos en el Manual de jQuery de DesarrolloWeb.com, pero realmente lo que hemos visto es una mera introducción a las posibilidades del API, así como unas explicaciones básicas para empezar a trabajar con jQuery en nuestras páginas web. Sin embargo, nos gustaría ir publicando una documentación en español completa, para que cualquier desarrollador pueda aprender a fondo esta librería Javascript y crear cualquier tipo de aplicación enriquecida del cliente.

Estamos seguros que personas con un nivel medio-alto de Javascript y de programación orientada a objetos, con lo que hemos visto hasta el momento en el manual y la referencia del API jQuery, podrán con relativa facilidad adentrarse en características avanzadas de la librería. Sin embargo, para los demás y los que deseen una ayuda adicional, esperamos que este artículo y los siguientes puedan abrir un camino, sencillo de seguir, para aprender a hacer todo tipo de desarrollos con Javascript y jQuery.

Comencemos pues por el inicio, tal como está en la documentación de jQuery, tratando en primer caso el "Core".

Core de jQuery

El core de jQuery es la base sobre la que se trabaja para hacer cualquier cosa con jQuery. Contiene una serie de clases y métodos útiles para hacer tareas reiterativas, que vamos a necesitar al desarrollar con la libería. Integra desde funciones que serán útiles en cualquier script, por sencillo que sea, hasta funciones menos recurridas pero que nos facilitarán la vida a hora de hacer código limpio, corto y reutilizable.

Utilizaremos el Core para realizar cosas útiles con objetos, clases, datos, etc., pero realmente lo que más haremos será utilizar la función jQuery, que es el pilar fundamental sobre el que se basarán las aplicaciones.

Core tiene las funciones clasificadas en diversos apartados que vamos a resumir a continuación. Como son funciones genéricas, los ejemplos que vamos a ver serán bastante básicos, más adelante podremos ver ejemplos más aplicados a prácticas habituales en sitios web.

$() (La funcion jQuery)

Es la función principal de jQuery, que además tiene diversas utilidades según los parámetros que se le envíen. Su utilidad principal es obtener elementos de la página.

La función $ o función jQuery la hemos visto ya, puesto que cualquier ejemplo sencillo la utiliza. Permite entre muchas cosas extender los elementos para que tengas las funcionalidades de la librería.

let elementoExtendidoConJQuery = $("#elemento");

La vamos a ver con detalle en el próximo artículo, así que si quieres puedes consultar sobre función dólar $()

Accesorios de objetos:

Es una gama de funciones de diversa y variada utilidad, que sirven de utilidad para hacer cosas con objetos, tales como iterar con cada uno de sus elementos, saber su tamaño, longitud, el selector o contexto con el que se obtuvo, obtener todos sus elementos DOM que contenga, etc.

En próximos artículos vamos a ver algunos usos clave de los métodos de utilidad para objetos jQuery.

• Método each del core de jQuery
• Método size() de los objetos jQuery

Trabajo con datos:

Unas funciones útiles para trabajar con datos y asociarlos a elementos, una forma de guardar información adicional a elementos de la página. En ese sentido nos encontramos un método especialmente útil que explicaremos con ejemplos en el artículo de data() de jQuery.

También encontramos aquí diversas funciones para trabajar con colas y administrar la salida y entrada de sus elementos.

Plugins:

Funciones que permiten extender los elementos jQuery para incorporar nuevos métodos, algo que se utiliza habitualmente a la hora de crear plugins para añadir funcionalidades a jQuery.

Tenemos una sección completa en este manual dedicada a la construcción de plugins. Si te interesa puedes empezar leyendo el artículo de introducción a los plugins en jQuery.

Interoperabilidad:

Funciones que permiten que jQuery no tenga problemas de compatibilidad con otras librerías Javascript que también suelen utilizar la función dólar $().

Aquí podemos ver un ejemplo de uso del método noConflict() qué podríamos hacer cuando usamos dos librerías que trabajan con el identificador $, para que una librería no machaque las funcionalidades de la otra.

Ejemplo de desambiguación de $ con noConflict()

Vamos a suponer que tenemos dos librerías. Entonces comenzaremos incluyendo el script de la librería que usa $ y luego el script de jQuery.

<script src="libreria_que_usa_dolar.js"></script>
<script src="jquery.min.js"></script>

Ahora, cuando necesitemos usar ambas librerías podemos hacer un esquema como el siguiente.

<script>
$.noConflict();
jQuery( document ).ready(function( $ ) {
  // Código que usa $ como la función jQuery.
});
// Código que usa $ con el significado de la otra librería
</script>

• Comenzamos ejecutando el método $.noConflict() de jQuery, que nos permite la interoperabilidad entre librerías, de modo que podamos usar ambos significados de la función $.
• Luego usamos el método ready() sobre el objeto docucument. Solo que para extender document hacemos uso de la función jQuery(), que es equivalente a la función $.
• En la función callback de ready() recibimos una referencia a la función $, que podremos usar con total confianza que se está refiriendo a la librería jQuery.
• El código que pongamos fuera del callback que hemos enviado a ready() hace uso de $ con el significado que le de la otra librería.

En el próximo artículo comenzaremos a tratar a fondo el Core de jQuery, hablando de la función dólar $().