Blog de Ciberseguridad

jQuery

May 28, 2013

JQuery_logo

Escribir menos, hacer más. Con este baseline se presenta jQuery, una librería de scripts que ayudarán a ganar tiempo, dinamismo y un toque de modernidad a nuestro sitio.

Gracias a jQuery  pasamos, por ejemplo,  de esto:

div=document.getElementById("output");
div.innerHTML="texto escrito en javaScript";

A esto :

$( "#output" ).html( "texto escrito en jQuery" );

Con esto hemos ahorrado algo de tiempo y espacio usando los selectores $(“#ouput”) para ids y $(“.myClass”) para clases. Además podemos combinar selectores, de una manera parecida a css, como $(#botonera button) que nos devuelve cualquier botón dentro de la div botonera, que podremos manipular aplicando acciones como en «$( «#output» ).html( «texto escrito en jQuery» );«.

Más ventajas. Sin jQuery, una función llamada desde un botón era referenciada en el mismo elemento con el evento onClick y definida en el <head> dentro de un script (o un .js externo).

Con jQuery definimos el evento y la función llamada dentro de otra función global $(document).ready(function(){}); (parecido al <body onload=»function()»>) y dentro de ésta la función de llamada para el evento click $(«#hide_button»).click(function(){}); quedando la estructura completa así:


$(document).ready(function(){
 $("#hide_button").click(function(){
   $("p").hide();    //
 });    //fin de función click #hide_button
});     //fin de función ready

 

En este caso se ocultan todos los párrafos con la función hide de jQuery pero las posibilidades són múltiples!

Dos enlaces con buenas listas de plugins:

Para más info:

Ir al contenido