jQuery para niños

jQuery
Información general
Tipo de programa	Biblioteca
Autor	John Resig
Desarrollador	Equipo de desarrollo
Modelo de desarrollo	Software libre
Lanzamiento inicial	26 de agosto de 2006
Licencia	MIT
Estado actual	En desarrollo
Idiomas	Inglés (documentación)
Información técnica
Programado en	JavaScript
Plataformas admitidas	véase soporte en navegadores web
Versiones
Última versión estable	3.6.0 (info) (02 de marzo de 2021 (4 años, 4 meses y 2 días))
Última versión en pruebas	4.0.0-beta217 de julio de 2024
Asistencia técnica
Foros oficiales Soporte comercial
Enlaces
Sitio web oficial Blog Repositorio de código

jQuery es una herramienta muy útil para crear páginas web interactivas y dinámicas. Imagina que una página web es como un libro. jQuery es como un asistente que te ayuda a encontrar rápidamente partes de ese libro, cambiarlas o hacer que reaccionen cuando alguien las toca o hace clic. Fue creada por John Resig en 2006.

Hoy en día, es una de las herramientas más usadas por los desarrolladores web. Sirve para hacer que los sitios sean más divertidos y fáciles de usar.

jQuery es un programa de código abierto. Esto significa que cualquiera puede ver cómo está hecho y usarlo gratis. Tiene una licencia especial que permite usarlo en proyectos de todo tipo. Gracias a jQuery, los programadores pueden lograr resultados increíbles con menos código.

Su forma de escribir código hace que sea más fácil navegar por una página web. También permite seleccionar elementos, crear animaciones y manejar lo que ocurre cuando interactúas con la página. jQuery también permite a los desarrolladores crear "complementos". Estos son pequeños programas que añaden más funciones a la biblioteca.

Grandes empresas como Microsoft y Nokia anunciaron en 2008 que usarían jQuery en sus plataformas. Esto demuestra lo importante que es esta herramienta en el mundo de la tecnología.

¿Qué es jQuery y para qué sirve?

jQuery es una biblioteca de JavaScript. Una biblioteca es como una caja de herramientas llena de funciones ya hechas. Estas funciones ayudan a los programadores a hacer cosas complejas de forma sencilla.

¿Cómo funciona jQuery en una página web?

Una página web está organizada como un árbol. Cada parte de la página (un texto, una imagen, un botón) es como una hoja o una rama de ese árbol. A esta estructura se le llama Modelo de Objetos del Documento (DOM).

jQuery simplifica la forma de encontrar y cambiar estas partes del DOM. Por ejemplo, puedes usar jQuery para encontrar todos los títulos de una página. Luego, puedes cambiar su color o hacer que se muevan cuando alguien pasa el ratón por encima.

¿Qué hace jQuery más fácil para los programadores?

jQuery también facilita la forma en que las páginas web responden a lo que haces. Por ejemplo, cuando haces clic en un botón, jQuery puede hacer que algo cambie en la página. Todo esto se hace de forma sencilla y en un solo paso.

Los principios clave de jQuery son:

• Separar el código: Ayuda a mantener el código de la página web (HTML) y el código de las acciones (JavaScript) separados. Esto hace que el código sea más ordenado.
• Ser claro y breve: Permite escribir menos código para hacer más cosas.
• Funcionar en todos los navegadores: Los navegadores web (como Chrome, Firefox o Edge) a veces funcionan un poco diferente. jQuery se encarga de que tu página web se vea y funcione bien en todos ellos.
• Poder añadir más cosas: Es fácil crear nuevas funciones y añadirlas a jQuery.

Historia de jQuery

jQuery fue creado por John Resig en enero de 2006. Desde entonces, un equipo de desarrolladores lo mantiene y mejora.

Al principio, jQuery tenía una licencia que causaba algo de confusión. Pero en 2012, se decidió que solo tendría la Licencia MIT. Esta licencia es muy abierta y permite que casi cualquiera use y modifique el código libremente.

jQuery se ha vuelto muy popular. En 2019, se usaba en la mayoría de los sitios web más importantes del mundo. Esto lo convierte en una de las herramientas de JavaScript más utilizadas.

Características principales de jQuery

jQuery tiene muchas características que lo hacen muy útil:

• Permite seleccionar elementos del DOM de forma sencilla.
• Ayuda a cambiar y organizar las partes de una página web.
• Maneja los eventos, como clics o movimientos del ratón.
• Permite cambiar el estilo de los elementos (colores, tamaños, etc.).
• Crea efectos visuales y animaciones.
• Permite cargar información sin recargar toda la página (esto se llama AJAX).
• Ofrece herramientas para obtener información del navegador o trabajar con datos.
• Funciona en muchos navegadores web modernos.

¿En qué navegadores funciona jQuery?

jQuery 3.0 y versiones posteriores funcionan en las versiones más recientes de navegadores como Firefox, Chrome, Safari y Edge. También es compatible con Internet Explorer 9 y versiones más nuevas. En dispositivos móviles, funciona con iOS 7 y Android 4.0 en adelante.

¿Cómo se usa jQuery en una página web?

Para usar jQuery, los programadores suelen incluir un solo archivo de JavaScript en su página web. Este archivo contiene todas las funciones de jQuery.

Se puede incluir de dos maneras:

• Guardando el archivo en el mismo servidor que la página web.
• Usando una Red de Distribución de Contenidos (CDN). Esto significa que el archivo se carga desde un servidor especial que está muy cerca del usuario, haciendo que la página cargue más rápido.

Aquí tienes un ejemplo de cómo se incluye jQuery en una página web: <script src="jquery.js"></script> O desde una CDN: <script src="https://code.jquery.com/jquery-3.4.0.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>

La función mágica $()

La característica principal de jQuery es que permite cambiar el contenido de una página web sin tener que recargarla. Esto se hace usando una función especial llamada $() (o jQuery()).

Esta función recibe un "selector", que es como una instrucción para encontrar elementos en la página. Por ejemplo:

$("#tablaAlumnos"); // Busca el elemento con id="tablaAlumnos"
$(".activo");       // Busca todos los elementos con class="activo"

Una vez que jQuery encuentra los elementos, puedes aplicarles muchas funciones. Por ejemplo, para cambiar su estilo:

// Quita el estilo "activo" y añade el estilo "inactivo" a los elementos con class="activo"
$(".activo").removeClass("activo").addClass("inactivo");

O para añadir efectos visuales:

// Hace una animación de "deslizamiento" en los elementos con class="activo"
$(".activo").slideToggle("slow");

Preparando la página para jQuery

Antes de que jQuery empiece a hacer cambios en una página, es importante asegurarse de que toda la página se haya cargado por completo. Para esto, se usa una función especial:

$(document).ready(function() {
   // Aquí se escriben todas las acciones que jQuery debe hacer en la página.
});

Esto asegura que jQuery no intente cambiar algo que aún no está listo.

Versiones de jQuery

jQuery ha tenido muchas versiones a lo largo de los años, mejorando y añadiendo nuevas funciones. La primera versión estable, la 1.0, se lanzó el 26 de agosto de 2006. Desde entonces, el equipo de desarrollo ha lanzado muchas actualizaciones para mejorar su rendimiento, añadir compatibilidad con nuevas tecnologías y corregir errores. La versión 3.6.0, por ejemplo, se lanzó en marzo de 2021.

Más información

• jQuery UI
• Mootools
• Prototype
• Yahoo! UI Library
• Biblioteca (informática)

Véase también

En inglés: JQuery Facts for Kids