Manual de jQuery

Introducción a jQuery

1.- Introducción a jQuery
Qué es jQuery, para qué sirve y qué ventajas tiene el utilizar este framework Javascript. Entrar

2.- Demo muy simple de uso de jQuery
Vamos a hacer nuestro primer script en jQuery, con unas funcionalidades muy simples, para que sirva de demo de uso de este framework. Entrar

3.- Pasos para utilizar jQuery en tu página web
Una descripción de la puesta en marcha de tu primer script jQuery, en tu propia página web, paso a paso. Entrar

4.- Básicos jQuery: añadir y quitar clases CSS sobre elementos
Otro ejemplo básico con jQuery, para mostrar cómo se pueden añadir y quitar clases CSS a elementos de la página, bajo respuesta de eventos de usuario. Entrar

5.- Mostrar y ocultar elementos de la página con jQuery
Con el método css() de jQuery podemos aplicar cualquier estilo css a elementos de la página. Veremos cómo aplicarlo para mostrar y ocultar elementos de la página. Entrar

6.- Efectos rápidos con jQuery
Algunos efectos dinámicos se pueden hacer con jQuery con rapidez impactante y extremadamente poco código Javascript. Entrar

7.- Callback de funciones jQuery
Con callback de jQuery podemos hacer una secuencia de llamadas a funciones o una pila de funciones que se ejecutarán una detrás de otra. Entrar

8.- Uso de Ajax muy sencillo con jQuery
Es muy fácil desarrollar Ajax en jQuery. En este artículo veremos el ejemplo más sencillo de Ajax con el framework Javascript jQuery. Entrar

9.- Ajax jQuery con mensaje de carga
Vemos más posibilidades de Ajax en jQuery, modificando un ejemplo anterior, para crear un mensaje de carga mientras que el usuario espera la respuesta Ajax del servidor. Entrar

10.- jQuery CDN o hosting local de las librerías
El CDN nos ofrece una manera más optimizada de incluir las librerías jQuery. Ventajas e inconvenientes de la opción de alojar el código del framework jQuery en local o enlazarlo desde uno de los servicios CDN. Entrar

Core de jQuery

11.- Core de jQuery
El core de jQuery lo forman las funciones más recurridas y que forman la base sobre la que se asienta el cualquier cosa en este framework Javascript. Entrar

12.- Función jQuery o función $()
Veremos con detalle la función más importante de jQuery y para ello comenzaremos viendo su uso más común: seleccionar elementos de la página y obtener un objeto jQuery con los elementos seleccionados. Entrar

13.- Otros usos de la función $()
La función jQuery(), o con su abreviación $(), tiene otros usos interesantes cuando le enviamos parámetros distintos a los vistos en el artículo anterior. Entrar

14.- Core/each: each del core de jQuery
Conozcamos con detalle el método each del core de jQuery, para ejecutar una función en cada uno de los elementos de un grupo. Entrar

15.- Método size() y propiedad length del core de jQuery
Dos formas de acceder al número de elementos que hay en un objeto jQuery, a través del método size() y la propiedad length. Entrar

16.- Método data() Core jQuery
El método data() del core de jQuery sirve para almacenar información en los elementos de la página, en pares nombre de variable y valor. Veremos también el método removeData() para eliminar datos almacenados. Entrar

17.- Consideraciones interesantes de data() y removeData()
Ahora veremos algunos puntos interesantes y nuevos ejemplos sobre el funcionamiento de los métodos data() y removeData() de jQuery. Entrar

Selectores de jQuery

18.- Selectores en jQuery
Los selectores sirven para seleccionar elementos de la página a partir de una cadena de texto que le pasamos a la función jQuery. Entrar

19.- Ejemplo para practicar con selectores en jQuery
Ejemplo de página que nos permitirá hacer prácticas con los selectores de jQuery. Entrar

20.- Selectores de Jerarquía en jQuery
Selectores que sirven para seleccionar elementos atendiendo a la estructura o jerarquía de las etiquetas de la página. Entrar

Métodos de Attributes en jQuery

21.- Acceder y modificar atributos HTML desde jQuery
En jQuery existe una función llamada attr() que sirve para recuperar y alterar atributos de los elementos de la página. Entrar

22.- Método attr() de jQuery, otros usos y removeAttr()
Un uso adicional del método attr() de jQuery, para modificar atributos con el valor devuelto de una función y borrar atributos de elementos de la página con removeAttr(). Entrar

Métodos de CSS de jQuery

23.- Método css() de jQuery
Sin duda css() es uno de los métodos más utilizados en el día a día del trabajo con jQuery. Sirve para cambiar y obtener el valor de cualquier atributo css. Entrar

24.- Funciones CSS de jQuery para conocer el tamaño y posición de elementos
Seguimos viendo funciones CSS del framework Javascript jQuery, en este caso las que sirven para conocer el tamaño y posición de los elementos en la página. Entrar

Eventos en jQuery

25.- Eventos en jQuery
Una introducción al trabajo con eventos en el framework Javascript jQuery. Entrar

26.- Manejadores de eventos en jQuery
Un listado con los distintos manejadores eventos que podemos definir en jQuery, ordenados por los tipos eventos de ratón, eventos de teclado o cualquiera de los dos. Entrar

27.- Introducción Objeto evento en jQuery
Explicaciones iniciales sobre el objeto evento en jQuery y mostramos cómo averiguar la posición del ratón al producirse un evento en la página. Entrar

28.- Eventos de ratón en jQuery mouseenter y mouseleave
Práctica con eventos de ratón en jQuery, en la que mostraremos el uso de mouseenter y mouseleave, junto con el objeto evento, para averiguar la posición del ratón. Entrar

29.- Eventos de teclado en jQuery
Cómo trabajar con eventos de teclado en jQuery y saber qué teclas han pulsado los usuarios, a través de la propiedad which del objeto evento. Entrar

30.- Definir eventos con bind() y eliminarlos con unbind()
El método bind() sirve para definir eventos de manera genérica, de cualquier tipo. Con el método unbind() podemos eliminar un manejador cualquiera indicado con bind(). Entrar

31.- Eventos definidos con live() en jQuery
Método live() para definir eventos en jQuery: cómo crear eventos sobre elementos que coincidan con un selector, en el momento actual o en el futuro. Entrar

Desarrollo de plugins en jQuery

32.- Plugins en jQuery
Veamos qué son los Plugins en jQuery y cómo podemos crearlos para expandir las posibilidades del framework. Entrar

33.- Reglas para el desarrollo de plugins en jQuery
Para construir plugins en jQuery tenemos que seguir una serie de normas. Además veremos un nuevo ejemplo práctico sobre el desarrollo de plugins en jQuery. Entrar

34.- Plugin jQuery: textarea con cuenta de caracteres
Segundo ejemplo de plugin práctico en jQuery para hacer textarea que lleva la cuenta de los caracteres escritos por el usuario. Entrar

35.- Gestión de opciones en plugins jQuery
Manera de gestionar opciones en los plugins de jQuery, a través de un objeto de options enviado al invocar el plugin, para hacerlos un poco más versátiles y con configuración más fácil. Entrar

36.- Plugin Tip con opciones en jQuery
Un ejemplo de plugin en jQuery para hacer un sistema de tip más avanzado, que permite configurarse por medio de unas opciones en el plugin. Entrar

37.- Funciones y variables dentro de plugins jQuery
Las funciones en los plugins pueden verse como funciones y variables privadas del plugin, que nos sirven para definir una mejor lógica de programación y estructura de datos y código. Entrar

38.- Plugin checkbox personalizado con jQuery
Un plugin en jQuery para hacer un campo de formulario checkbox pero con un diseño distinto, totalmente personalizable por el desarrollador. Entrar

39.- Alias personalizado y ocultar código en plugins jQuery
Cómo crear un alias personalizado a $, para mejorar la compatibilidad en todos los contextos, y ocultar el código privado de los plugins jQuery. Entrar

Efectos en jQuery

40.- jQuery animate(): Animación de propiedades CSS
El método animate() de jQuery permite animar varias propiedades, con valores numéricos, de CSS en un solo paso. Entrar

41.- Animaciones de color con jQuery
Cómo realizar animaciones con colores en jQuery por medio del método animate() y el plugin Color animation jQuery. Entrar

42.- Fading en jQuery
Efectos de cambio de opacidad de los elementos en la página, con los métodos de fading en jQuery, fadeIn(), fadeOut() y fadeTo(). Entrar

43.- Colas de efectos en jQuery
Vamos a explicar qué es una cola de efectos, para qué nos sirve y cómo se configuran las colas de efectos en el framework Javascript jQuery. Entrar

44.- Método queue() para acceder a una cola de efectos
Veremos cómo hacer cosas con las colas de efectos en jQuery, haciendo nuestra primera prueba con el método queue(), que permite acceder y modificar la cola de efectos. Entrar

45.- Meter cualquier tipo de función en una cola de efectos jQuery
En la cola de efectos podemos introducir cualquier tipo de función, aunque no sean efectos jQuery, y para ello vamos a aprender a encolar cualquier conjunto de sentencias con el método queue(). Entrar

46.- Parar la ejecución de una cola de efectos jQuery
Cómo detener la ejecución de una cola de efectos con el método stop() y revisión del uso de queue() para indicar una nueva lista de funciones de efectos a ejecutar con jQuery. Entrar

47.- Método delay() para retrasar la ejecución efectos de la cola
El método delay() de jQuery sirve para generar un intervalo de espera entre la ejecución de funciones de la cola de efectos. Entrar

48.- Cola de efectos personal (no predeterminada) en jQuery
Vamos a mostrar cómo trabajar con otras colas de efectos distintas que la cola de efectos predeterminada. Entrar

Añadidos al Manual de jQuery

49.- Método jQuery.extend()
Uno de los métodos del paquete utilities de jQuery, que sirve para extender el contenido de dos o más objetos en uno de ellos. Entrar

50.- $.get() de jQuery para hacer una solicitud Ajax tipo HTTP GET
Análisis y ejemplos de la función $.get() de jQuery que sirve para hacer una solicitud Ajax al servidor en la que podemos enviar datos por el método GET. Entrar

51.- Eventos en una solicitud ajax con $.get() en jQuery
Tratamiento de eventos relacionados con las solicitudes ajax en jQuery desde la función $.get(). Entrar

52.- Parámetros recibidos por las funciones de los eventos Ajax
Ejemplos de solicitud Ajax con diversos eventos, en los que se reciben parámetros con datos y referencias útiles para los scripts jQuery. Entrar

53.- Introducción a jQuery Mobile
Características de jQuery Mobile, el framework Javascript para desarrollo de aplicaciones web para móviles, basado en jQuery. Entrar