3 Conceptos Basico Jquery

3 Conceptos Básicos de jQuery
3.1 $(document).ready()
No es posible interactuar de forma segura con el contenido de una página hasta que el documento no se encuentre preparado para su manipulación. jQuery permite detectar dicho estado a través de la declaración $(document).ready() de forma tal que el bloque se ejecutará sólo una vez que la página este disponible.
El bloque $(document).ready()$(document).ready(function() {
console.log('el documento está preparado');
});

Existe una forma abreviada para $(document).ready() la cual podrá encontrar algunas veces; sin embargo, es recomendable no utilizarla en caso que este escribiendo código para gente que no conoce jQuery.
Forma abreviada para$(document).ready()
$(function() {
console.log('el documento está preparado');
});

Además es posible pasarle a $(document).ready() una función nombrada en lugar de una anónima:
Pasar una función nombrada en lugar de una función anónima
function readyFn() {
// código a ejecutar cuando eldocumento este listo
}


$(document).ready(readyFn);

3.2 Selección de Elementos
El concepto más básico de jQuery es el de “seleccionar algunos elementos y realizar acciones con ellos”. La biblioteca soporta gran parte de los selectores CSS3 y varios más no estandarizados. Enhttp://api.jquery.com/category/selectors/ se puede encontrar una completa referencia sobre los selectores de la biblioteca.
A continuación se muestran algunas técnicas comunes para la selección de elementos:
Selección de elementos en base a su ID
$('#myId'); // notar que los IDs deben ser únicos por página

Selección de elementos en base al nombre de clase
$('div.myClass');// si se especifica el tipo de elemento,
// se mejora el rendimiento de la selección

Selección de elementos por su atributo
$('input[name=first_name]'); // tenga cuidado, que puede ser muy lento

Selección de elementos en forma de selector CSS
$('#contents ul.people li');Pseudo-selectores
$('a.external:first'); // selecciona el primer elemento <a>
// con la clase 'external'
$('tr:odd'); // selecciona todos los elementos <tr>
// impares de una tabla
$('#myForm :input'); // selecciona todoslos elementos del tipo input
// dentro del formulario #myForm
$('div:visible'); // selecciona todos los divs visibles
$('div:gt(2)'); // selecciona todos los divs excepto los tres primeros
$('div:animated'); // selecciona todos los divs actualmente animadosNota
Cuando se utilizan los pseudo-selectores :visible y :hidden, jQuery comprueba la visibilidad actual del elemento pero no si éste posee asignados los estilos CSS visibility o display — en otras palabras, verifica si el alto y ancho físico del elemento es mayor a cero. Sin embargo, esta comprobación no funciona con los elementos <tr>; en este caso, jQuery comprueba si se está aplicando elestilo display y va a considerar al elemento como oculto si posee asignado el valor none. Además, los elementos que aún no fueron añadidos al DOM serán tratados como ocultos, incluso si tienen aplicados estilos indicando que deben ser visibles (En la sección Manipulación de este manual, se explica como crear y añadir elementos al DOM).
Como referencia, este es el fragmento de código que utiliza...