Luis Labra

jQuery es una biblioteca javascript (también traducido de forma incorrecta como librería javascript, al traducir el término inglés “javascript library”). En ocasiones también se llama framework por que aporta una filosofía propia y un marco de trabajo concreto sobre como desarrollar plugins javascript.

Gracias a esta biblioteca los programadores javascript podemos ahorrarnos muchas lineas de código y muchas horas de desarrollo.

¿Cuáles son los plugins de jQuery más utilizados?

Basándome en mi experiencia hay dos funcionalidades imprescindibles:

Plugins de selección de elementos. Gracias a los plugins de selección podemos seleccionar elemento html por una gran cantidad de filtros. Los filtros más utilizados son ID, clase css y tipo de etiqueta html. También podemos filtrar elementos por nombre (atributo name html) o combinar varios filtro (por ejemplo etiqueta DIV + claseCSS).

Plugins de soporte a eventos. La cantidad de eventos soportados por los plugins es enorme.

• Eventos javascript al cargar la página: Tenemos varios eventos relacionados con la carga de la página (onload, ready, etc). Estos eventos nos permiten elegir en que situación ejecutamos una función JS. Por ejemplo podemos elegir si queremos ejecutar la función inmediatamente o si queremos esperar a que finalice la carga completa de la página.
• Eventos basados en movimientos del ratón. Por ejemplo podemos utilizar los típicos click o hover. También podemos utilizar otros más concretos como cuando sale de un elemento (que requiere que el cursor se ponga sobre el elemento y salga) o el doble click.
• Eventos al pulsar teclas. Hay una gran variedad. En realidad existen casi todos los que te puedas imaginar. Desde seleccionar el instante en que se pulsar la tecla, hasta el instante en que se levanta, hasta medir los milisegundos que el usuario tarda en levantar el dedo. Podemos decidir si ejecutar algo antes de que el usuario termine de pulsar la tecla (pero cuando ya ha comenzado) o podemos decidir esperar a que haya finalizado la inserción del carácter en el campo de texto. La diversidad de plugins es enorme.

Plugin Ajax. Este plugin también fue revolucionario. La facilidad con la que se implementan llamadas ajax con el plugin de jQuery es considerable.

Además, permite especificar con detalle la invocación y procesar la respuesta exactamente como se quiera. En apenas 10 líneas de código puedes recuperar cualquier conjunto de valores del backend, transformar la respuesta y utilizar la información para rellenar elementos de la página.

¿Qué es jQuery UI?

jQuery UI es una biblioteca de componentes visuales. Estos componentes están basados en la filosofía definida por la librería jQuery, cada componente implementado mediante un widget. Además de los propios componentes visuales jQuery UI también incluye un conjunto de funcionalidades para la creación de efectos visuales en páginas web.

Los widget de jQuery UI aportan funcionalidades para las que no existen componentes html o que los componentes html son demasiado sencillos. Algunos ejemplos de widgets son: Slider (control deslizante), ProgressBar (barra de progreso), Calendario, Menú, acordeón, tooltip.

También es posible implementar tus propios componentes visuales y efectos visuales extendiendo la propia librería jQueryUI. Para ello simplemente hay que implementar un plugin siguiendo las buenas prácticas de jquery.

¿Qué diferencias hay entre jQuery y jQuery UI?

jQuery y jQuery UI son librerías complementarias. La primera es una biblioteca enfocada a interactuar con elementos del DOM ya existentes (principalmente etiquetas html). La segunda enriquece el conjunto de elementos que podemos utilizar en nuestra página web incluyendo objetos que no existen como etiquetas html como los ejemplos que ponía antes (slider, barra de progreso, acordeón, calendario, etc). Gracias a ello podemos utilizarlo en nuestra aplicación web escribiendo solamente un par de líneas de código.

En resumen, el uso de jQuery y jQuery UI aportan una gran cantidad de funcionalidades. Además orientan al programador y le facilitan considerablemente sus desarrollos.