JQuery

¿Qué es JQuery?

JQuery es una librería de JavaScript. Esta librería de código abierto, simplifica la tarea de programar en JavaScript y permite agregar interactividad a un sitio web sin tener conocimientos del lenguaje. Permite manipular elementos del DOM (textos, imágenes, enlaces, etc.) , cambiar el diseño CSS o realizar peticiones Ajax utilizando instrucciones simples, a través de un código muy conciso y sencillo. Basados en esta librería, existe una infinita cantidad de plugins (gratis y de paga) creados por desarrolladores de todo el mundo.

Estos plugins resuelven situaciones concretas dentro del maquetado de un sitio, por ejemplo: un menú responsivo, una galería de fotos, un carrusel de imágenes, un slide, un header que cambia de tamaño, el deslizamiento del scroll al hacer clic en un botón (anclas HTML), la transición entre páginas y miles de efectos más.

Cada plugin tiene un sitio web, desde donde se puede descargar, y en donde se encuentran tutoriales, demostraciones, y todo lo relacionado con este.

Libreria

Todos los plugins de JQuery necesitan la librería de JQuery para funcionar. La librería es un archivo .js que se puede descargar desde el sitio oficial: https://jquery.com/ colocar en una carpeta js y luego vincular con una etiqueta , por ejemplo:

jquery-3.2.1.min.js"> Ese vínculo conviene colocarlo dentro del body y hacia el final del HTML para no demorar la carga de los contenidos. Si descargamos el archivo y lo vinculamos de esa manera, debemos subir el archivo a nuestro hosting.

¿Por qué no utilizar simplemente JavaScript?

Es posible realizar el mismo trabajo utilizando solamente JavaScript, sin la biblioteca jQuery, pero la razón principal por la que mucha gente prefiere jQuerys que es mucho menos verboso. Se puede hacer lo mismo con muchas menos líneas de código, esa es la clave de su éxito.

En la siguiente imagen se puede ver de forma gráfica el uso de cada elemento.

La sintaxis básica es la siguiente.

$(«selector inicio»).evento(function () {
$(«selector destino»).funcion o método(atributo)
});

✔ Selector de inicio es quien inicia la acción.
En JQuery se pueden usar como selectores elementos HTML como a (enlaces) h1, h2, etc. También clases usando (.nombre) e identificadores (#nombre).
✔ Evento puede ser click, hover, etc.
✔ Selector de destino es el que identifica el elemento a modificar.
✔ Las funciones o métodos son quienes finalmente ejecutan la tarea y los atributos son opcionales en algunos casos.

Diseña un sitio como este con WordPress.com
Comenzar