Aprende a generar dinero desde casa

¿Qué es y para qué sirve jQuery?

¿Qué es y para qué sirve jQuery?
Mediante este tutorial pretendemos explicar, que es, como se usa y para qué sirve una de las librerías para Javascript más populares.

jQuery nos da la posibilidad de realizar tareas complejas en JavaScript de una manera muy sencilla. A través de esta maravillosa Librería de JavaScript podemos ocular, mostrar, arrastrar y hacer prácticamente lo que deseemos con los elementos DOM de nuestra página web.

También, otra de las características fundamentales es que nos permite manipular CSS como así también utilizar AJAX de una manera sencilla.

¿Qué es jQuery?

jQuery es considerado un Framework de Javascript, o ambiente de desarrollo. Lo que no es más que un conjunto de utilidades las cuales no necesitan ser programadas, de hecho ya fueron programadas, probadas y podemos utilizarlas de una manera muy simplificada. 

En otras palabras, podremos lograr los mismos resultados, en menos tiempo sin necesidad de programar una funcionalidad completamente.

¿Qué es un Framework de Javascript? 

La palabra Framework se podría traducir al español como “Marco de desarrollo”. En nuestro caso, el marco seria en Javascript. Por lo tanto, se podría decir que jQuery es un marco de desarrollo el cual contiene funcionalidades, librerías pre-desarrolladas. 

¿Qué puedo hacer con jQuery? 

jQuery nos permite agregar efectos y funcionalidades complejas a nuestro sitio web, como por ejemplo: galerías de fotos dinámicas y elegantes, validación de formularios, calendarios, hacer aparecer y desaparecer elementos en nuestra página y muchas otras poderosas opciones. Otra ventaja sin duda es la posibilidad que nos brinda de trabajar con AJAX, sin preocuparnos de los detalles complejos de la programación. 

¿Por Qué utilizar jQuery? 

Muchas veces nos planteamos si es mejor utilizar cosas ya hechas o desarrollarlas por nuestra propia cuanta. Bueno… este es totalmente relativo dado que cuando programamos, muchos de los lenguajes utilizados no son de bajo nivel, es decir estamos utilizando funciones pre-desarrolladas y simplificadas. 

Con jQuery ocurre lo mismo, por ejemplo: el detectar que tipo de explorador utiliza un visitante tendríamos que escribir una cuentas líneas de código en Javascript. Dado que jQuery es totalmente compactible con la mayoría de los exploradores, Internet Explorer, Firefox, Opera, Apple Safari etc. En definitiva, nosotros no necesitamos preocuparnos por los asuntos de compactibilidad, jQuery lo hace automáticamente. 

El soporte es otra de las razones por la cual la utilización de jQuery en nuestros sitios es totalmente recomendada. Esta fantástica librería ha tenido una aceptación muy grande por los programadores, lo que ha generado que muchos desarrolladores se dediquen a la creación de plugins o complementos que utilizan jQuery. Esto nos permite agregar galerías dinámicas, calendarios, sistemas de votación, formularios dinámicos y muchas otras cosas tan solo agregando los plugins. 

Otra razón, que es muy importante es que es gratis, y el código fuente puede ser modificada y adaptado a nuestras necesidades siguiendo las políticas de las licencias (MIT y GPL2) 

¿Qué es un Plugin de jQuery? 

Un plugin es un sub-sistema o componente que se “agrega” a jQuery para que podamos utilizarla. Por ejemplo, jQuery no incluye en su código fuente una funcionalidad para “crear” un calendario, pero, podemos agregarle un calendario ya desarrollado el cual necesita jQuery para funcionar. 

Llevando la explicación a un plano más cotidiano. La computadora tiene un sistema operativo, habitualmente es Windows, pero, para chatear con tus amigos y familiares utilizas Windows Live Messenger. En este ejemplo esta aplicación para chatear sería un “plugin” para el sistema operativo de Windows. 

¿Confundido? 

Si la explicación no es muy clara, para comprender lo que es un plugin piensa que es un complemento de jQuery, es como una nueva funcionalidad que le agregamos a todo el conjunto que ya vienen incorporadas en el código fuente básico. 

¿Cómo comenzar a utilizar jQuery? 

Para hacer uso de esta fabulosa Librería tienes que bajarla directamente desde el sitio oficial. Haz clic aquí para bajar jQuery. 

Conceptos Básicos: 

En tu página HTML agrega lo siguiente dentro del tag HEAD.
<script type="text/javascript" src="jquery.js"></script>
Podemos adjuntar la librería en dos modos, el reducido que es ideal para agilizar y acelerar la carga de las páginas o la versión extendida, la cual tiene más tamaño y es ideal para los desarrolladores.

jQuery lo hace más fácil, para demostrarlo vamos a tomar como ejemplo una de las acciones más utilizadas cuando trabajamos con Javascript, que es la de seleccionar un elemento con “getElementById()”

Equivalente de getElementById() en jQuery.

El seleccionar un elemento con esta función requiere que el elemento tenga el atributo “id” 

JavaScript 

Seleccionar un elemento con Javascript de forma tradicional se hace de la siguiente manera:
// Seleccionar un elemento
document.getElementById("miElemento");
///
jQuery 

Mediante la utilización de la función “$()” de jQuery podemos seleccionar cualquier elemento de la página.
// Seleccionar un elemento
$("#miParrafo");
Es fácil darse cuenta a simple vista cual es más sencilla. Desde el punto de vista de la longitud de la sentencia, en jQuery se requiere mucho menos código para lograr lo mismo.

Equivalente de window.onload en jQuery. 

Este evento se utiliza para realizar tareas o bien modificar el contenido de tu página una vez que se haya cargado la página por completo o también antes que se termine la carga. 

JavaScript
window.onload = function() { ... }
jQuery
$(document).ready( function() { ... } );
La gran ventaja de utilizar jQuery es que se puede manipular todo el contenido HTML antes que se cargue totalmente la página.

Esta posibilidad nos permite acelerar nuestras páginas aun cuando no se haya cargado todo el árbol DOM. Es muy útil cuando trabajamos con galerías de fotos. jQuery puede maniuplar imágenes antes que se cargue toda la página en cambio JavaScript espera a que se carguen las imágenes.

Selectores Avanzados: 

Una de las funciones más útiles y sorprendentemente fáciles de jQuery son los selectores, la cual nos permite olvidarnos totalmente de “document.getElementById()”.

Es muy común para los programadores tener que saber por ejemplo cuales son los checkbox seleccionados de un formulario para validar una suscripción.

En JavaScript nos tomaría varias líneas de código obtener todos los checkbox seleccionados, afortunadamente con jQuery podemos hacerlo con una sola línea de código.
// Seleccionar todos los checkbox que han sido seleccionados
$("input[@type=checkbox][@checked]");
///
Pueden bajarse la versión estable desde el sitio oficial de jQuery en jQuery.

Publicar un comentario