Bienvenidos a esta serie de como usar JQuery paso a paso. En este primer articulo aprenderas como poner jquery en un documento HTML.
¿ Que Se Necesita Saber Para Aprender JQuery?
Para saber JQuery se necesita saber dos otros lenguajes: Javascript y CSS. Aunque no tenies que ser un experto en ninguno de estos dos, el altamente recomendable que lo seas para que asi puedas tambien serlo con JQuery.
Talvez te paresca un poco extraño que JQuery, siendo un framework echo con Javascript, utilize CSS, y si lo es, pero esto es una de las cosas que hace facil aprender JQuery.
Porque Es Necesario Saber CSS:
Para seleccionar un ID en un documento HTML con Javascript regular utilizarias
document.getElementById('identificacion');
En JQuery, en lugar de usar esta linea, te referirias a mismo elemento usando CSS asi.
$("#identificacion");
Como puedes ver, los selectores de CSS son usados como selectores en JQuery. Esto hace seleccionar elementos mucho mas facil!
Como Instalar JQuery
JQuery no es mas que un archivo de javascript y por lo tanto se incluye en un documento HTML como tal.
Hay dos maneras de instalar JQuery en tu pagina:
- Descargar JQuery de el sitio http://jquery.com/
- Incluir el archivo proporcionado por google
De estas dos maneras mi manera preferida, y la de muchos sitios incluyento Twitter, es la de incluir el archivo proporcionado por Google. Incluir JQuery atravez de Google es mejor porque asi no se gastan los recursos de TU servidor.
Asi es como incluirias JQuery en tu pagina.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
Como Usar JQuery
Aunque JQuery es Javascript tiene ponerse en un contenedor especial para aseguar que el navegador de internet no intente usarlo antes de cargar el framework.
El contenedor especial es el siguiente.
$(document).ready(function(){
// aqui va todo el codigo de jquery que quieras poner.
});
No hay mucho que explicar de este contenedor, simplemente le dice al navegador que cuando el documento este listo ejecute la funcion ( $(document).ready(function(){}); )
Tu Primer Programa JQuery
Adentro del contenedor de JQuery pudes usar Javascript regular si quieres, asi que aqui esta tu primer pagina con JQuery.
<html>
<head>
</head>
<body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
alert("estoy usando jquery");
});
</script>
</body>
</html>
Es un programa muy simple pero esta es una serie "Paso a Paso" no? 
Possibles Preguntas
Talvez tengas algunas preguntas, aqui esta la respuesta para dos posibles, tambien puedes dejar tus preguntas en los comentarios.
¿Porque pusiste el javascript hasta abajo del documento y no el el <head>?
Esta comprobado que al poner javascript antes dela etiqueta </body> hace que tu pagina paresca cargarse mas rapido ya que los graficos se cargan primero.
Cuando salga una version nueva de JQuery, ¿ como sabre cual es la nueva direccion del script?
Muy facil, solamente sigue este link que te llevara a la seccion de jquery en google.
http://code.google.com/apis/ajaxlibs/documentation/index.html#jquery
Si te gusto este tutorial no olvides dejar un comentario, subscribirte y compartir el articulo con tus amigos en facebook o twitter.
