Comenzando con jQuery
Introducción
http://jquery.com/
jQuery es una biblioteca JavaScript de código abierto y software libre, que facilita el acceso y la manipulación de documentos HTML, hojas de estilos, el árbol DOM, eventos, y llamadas AJAX.
Como todo código JavaScript, jQuery se ejecuta en la parte del cliente, es decir, es el navegador WEB el que se encarga de la ejecución de este código liberando la sobrecarga del servidor. Los principales navegadores WEB admiten jQuery como vemos
Compatible con Mozilla Firefox 2.0+, Internet Explorer 6+, Safari 3+, Opera 10.6+ y Google Chrome 8+.5
Que hay que saber para usar jQuery
Como había comentado anteriormente, jQuery permite manipular todo el entorno de una página WEB. En consecuencia, para sacar el mayor partido de jQuery deberemos conocer los fundamentos de JavaScript, HTML y hojas de stilos CSS, así como en qué consiste AJAX.
JQuery admite HTML5 y CSS3.
Cómo incorporar jQuery a mi página WEB
Para incorporar las funcionalidades de jQuery a mi página WEB tengo que descargar el fichero jquery.js e incorporarlo en la cabecera de la página. Se puede descargar en http://jquery.com.
El nombre del fichero incluye el número de versión. También podemos encontrar jquery-min.js, que es el mismo contenido pero comprimido para disminuir su volumen.
El código HTML sería algo así como:
Ejemplo
<!doctype html><html><head><meta charset="utf-8"><title>Introducción a jQuery</title><script src="/blog/jquery.js"></script></head><body>
...
Ahora tengo que incorporar mi propio código jQuery y JavaScript. Es importante observar que para que se ejecute el código jQuery que haga referencia a un elemento HTML este elemento tiene que existir previamente en el navegador. Una solución sería incorporar dicho código al final de la página y la otra solución es usar una función que se ejecute automáticamente cuando la página ya esté generada en el navegador.
Ejemplo
<!doctype html><html><head><meta charset="utf-8"><title>Introducción a jQuery</title><script src="/blog/jquery.js"></script><script>$( document ).ready(function() {// Aquí puedes poner tu código jQuery.});</script></head><body>...</body></html>
También podemos utilizar ficheros .js para incluir el código de jQuery en lugar de incorporarlo directamente el el código HTML:
Ejemplo
<!doctype html><html><head><meta charset="utf-8"><title>Introducción a jQuery</title><script src="/blog/jquery.js"></script><script src="/blog/ejemplo.js"></script></head><body>...</body></html>
Donde el fichero ejemplo.js sería el siguiente:
$( document ).ready(function() {// Aquí puedes poner tu código jQuery.});
La llamada $( document ).ready(function() { ... }); se ejecutará una vez que el documento ya esté preparado. Existe también, en caso de necesidades especiales, otras formas de llamar a código jQuery en otros momentos de la generación de la página WEB.
Es posible expresar $( document ).ready(function() {... de forma simplificada usando $(function(){... Ambos son equivalentes.