jQuery

jQuery es una de las herramientas mas utilizadas en la construcción de paginas web, ya que permite la utilización de AJAX a través de sus librerías de JavaScript, de esta manera permite una mejor manipulación de los elementos en la pagina web ya que permite que se hagan modificaciones en las paginas, o se procesen datos auxiliándose del navegador web, sin necesidad de llamar a un servidor, y a su vez permite pequeñas validaciones de la información ingresada por los usuarios.

jQuery es una biblioteca de JavaScript, creada inicialmente por John Resig, que permite simplificar la manera de interactuar con los documentos HTML, manipular el árbol DOM, manejar eventos, desarrollar animaciones y agregar interacción con la técnica AJAX a páginas web. Fue presentada el 14 de enero de 2006 en el BarCamp NYC. jQuery es la biblioteca de JavaScript más utilizada.

jQuery es software libre y de código abierto, posee un doble licenciamiento bajo la Licencia MIT y la Licencia Pública General de GNU v2, permitiendo su uso en proyectos libres y privados.2 jQuery, al igual que otras bibliotecas, ofrece una serie de funcionalidades basadas en JavaScript que de otra manera requerirían de mucho más código, es decir, con las funciones propias de esta biblioteca se logran grandes resultados en menos tiempo y espacio.

Utilización de jQuery.

Al ser una libreria de JavaScript, todos sus procedimientos están contenidos en un archivo de extensión js, por tanto debe ser referenciado a través de las etiquetas script de HTML.

<script src="jquery.js"></script>

Luego de esto, en nuestra pagina todos los procedimientos que han sido declarados en jQuery pueden ser utilizados.

Función $()

La interaccion con los elementos de una pagina web se hacen a traves de esta funcion,  un alias de jQuery(), que recibe como parámetro una expresión CSS o el nombre de una etiqueta HTML y devuelve todos los nodos (elementos) que concuerden con la expresión. Esta expresión es denominada selector en la terminología de jQuery.

Utilizar esta funcion permite obtener los componentes referenciados y ademas permite obtener sus atributos como por ejemplo val() (el valor contenido dentro de "x" elemento).

Ejemplo:

$("#tablaAlumnos"); // Devolverá el elemento con id="tablaAlumnos"
$(".activo");       // Devolverá una matriz de elementos con class="activo"

Una de las grandes ventajas de jQuery es que permite modificar el CSS de los elementos de la pagina web, gracias a esta tecnología funciona bootstrap y de hecho la manipulación de muchos elementos se efectúa a través de jQuery.

Ejemplo:

// Se elimina el estilo (con removeClass()) y se aplica uno nuevo (con addClass()) a todos los nodos con class="activo"
$(".activo").removeClass("activo").addClass("inactivo");

Una de las practicas mejor aceptadas en jQuery es que todos los disparadores de funciones se incluyan en el momento que la pagina web esta siento creada, es decir al momento en que la pagina web esta siendo creada se debe especificar los procedimientos que se ejecutaran cuando (por ejemplo) se le da click a un boton, el mouse pasa sobre una imagen, o se le da click a una imagen, para poder amarrar estos eventos se utiliza la funcion $(document).ready(function(){}); dentro de la cual se hacen bloques de código anónimos ya que no es necesario especificarles nombres.

Ejemplo:

$(document).ready(function(){
        $('img').click ( function() { 
              // Se escribe el procedimiento a seguir cuando se le da click al     elemento 'img'
        });
});

La documentacion oficial de jQuery puede ser encontrada en el siguiente link: jQuery.

El siguiente video es una pequena introduccion a este gran mundo:

Aca esta el link del video para verlo mas detenidamente y seguir la secuencia del curso jQuery tutorial.