Los que comenzamos con la programación web hace mas de 5 años atrás realmente conocimos lo complicado que era hacer un script para agregarle algo de dinamismo funcional a nuestros sitios. Luego, con la guerra de los navegadores esto se complicó aun más porque prácticamente teníamos que programar tantas alternativas como navegadores había. Incluso vi en más de un sitio que su página de bienvenida veía que navegador y resolución usabas y te redireccionaba a una página u otra.

El DOM (Document Object Model) viene masticándose desde aquel entonces y hoy más que nunca es un estándar innegable en todos los intérpretes. Y con esto, javascript se convirtió en algo mucho más accesible y preciso.

Existen librerías javascript que le hacen la vida mucho más fácil al desarrollador justamente por aprovechar el DOM en toda su extensión y hay interminables listas de librerías que podríamos usar en nuestra web.

En esta serie de posts voy a ir comentando las virtudes y mis experiencias personales con ellas, dando algunos ejemplos que serían engorrosos de reproducir “from scratch”.

Hoy le toca el turno a JQuery

JQuery es, para mi gusto, una de las mejores librerías para trabajar con el DOM de un documento. Simplifica el acceso a cualquier elemento del documento con precisos y simples atajos. Así es que, por ejemplo, un campo de texto con el la clase=”text” dentro de un formulario, dentro de un div, dentro del body del documento puede ser accedido con

$("input").filter(".text")


Y si ya entendieron el concepto, sabrán que un click en cualquier link del documento con un id o una clase “determinada” puede ser capturado de manera sencilla como por ejemplo:


$("a")
.filter(".determinada")
.click(function(){
alert("Hiciste click en el link con la clase 'determinada'");
return false;
})


Este es sólo el concepto del JQuery, llegar a todos lados escribiendo poco o nada de javascript. Pero además la misma librería básica de JQuery tiene efectos interesantes como por ejemplo el [element].hide(‘slow’) o el [element].show(slow) que antes requerían de un ciclo “for” donde decrementaba una variable y esa variable era asignada a la propiedad width/high del elemento. Pueden probarlo aquí

Ahi no acaba todo, JQuery tiene también muchos plugins que permiten incrementar su potencia y trabajar validando formularios, utilizando ajax, utilizando eventos entre varias otras cosas.

Como les comenté, es una de mis favoritas y nos hubiera ahorrado varios dolores de cabeza hace tres o cuatro años atrás.