Blog Telaio

Jquery se ha convertido en el framework javascript  favorito para muchos desarrolladores, ya que nos permite manipular el DOM, crear animaciones sin usar flash, etc. En mi caso me ha ayudado bastante para ahorrar código, y hacerme la vida mas facil. Jquery trabaja de forma muy similar a las CSS, así que si conoces sobre estilos, te sera aun más fácil entenderlo.

Es por eso que compartiré contigo los elementos que mas he utilizado.

SELECTORES

#id – Seleccionar un elemento por su ID, recuerda que el ID debe ser unico en todo nuestro documento.

$("#myelemento")

Para selecionar un id es necesario especificarlo con el simbolo # como se hace tambien en CSS.

element - Seleccionar un elemento de nuestra página.

$("span").addClass("txtMini");

Seleccionara todos los elementos span y les asignara una clase de estilo.

.class – Seleccionar un elemento con nombre en su atributo class.

$("span .subtitulos").css("color","red");

Seleccionara los spans que contengan la class .subtitulos y le dara un color rojo a la letra .

$(".subtitulos").css("font-size","13px");

Seleccionara los elementos que tengan la class .subtitulos y le dara un tamaño de letra de 13 pixeles.

ATRIBUTOS

Si quieres agregar un atributo aun elemento pero depende de algún evento, este método es el adecuado.

$("#btnSave").attr("disabled","disabled");

Si quieres remover un atributo aun elemento.

$("#btnSave").removeAttr("disabled");

Uno de los que mas ocupo y ahorro muchos caracteres, nos permite obtener el valor ingresado el elemento en su atributo value.

$("#email").val();

Si queremos cambiar el valor que contiene, solo le agregamos una cadena de texto.

$("#email").val("myemail@myemail.com");

Este ultimo metodo, nos permite ahorrar el fastidioso document.getElementByID(“valor”).value, que comunmente usaba antes de conocer jquery.

EVENTOS

Jquery nos permite manejar los eventos de una manera mas dinamica y asi no meter todo el codigo en nuestra página, asi podremos separar la funcionalidad de la interfaz de usuario. He aqui un ejemplo de agregar un evento click a un boton.

AJAX

Jquery nos hace la vida más facil para manejar ajax.


$.ajax({
type: "POST",
url: "data/checkData.asp",
data: "clave="+currClave,
cache: false,
success: function(msg){
alert("Mensaje de Alerta");
}
});


Con solo estas lineas de codigo, podemos hacer ajax.

Type: asignamos el tipo de envió

URL: le indicamos la pagina que se le hará la solicitud

data: la información que sera enviada

cache: evitamos que la información no se quede guardada en cada envío

success: aquí obtendremos la respuesta de la solicitud hecha.

Para concluir, me queda decir que jQuery es esencial en mi trabajo, y faltarían muchas palabras para describir aun mas elementos muy útiles que me han servido para desarrollar. Te invito a que visites su sitio y le revises su documentación, que por cierto es buenísima.

jquery.com