jQuery+Selectors

=Selectores jQuery=
 * toda la lista: @http://api.jquery.com/category/selectors/
 * para poder seleccionar uno o un grupo de **elementos** (**tags** html) basándonos en su
 * id
 * atributos
 * clase CSS
 * anidamiento
 * orden
 * una vez seleccionado un **elemento**, se puede actuar (obtener o modificar) sobre el
 * los valores de sus atributos

Nota para ASP.NET con páginas maestras
code format="html4strict" <%@ Page ... ClientIDMode="Static" %> code
 * poner en @PAGE que los id se mantengan estáticos

=$(selectores)=
 * Tanto en CSS como JQuery para indicar ciertos elementos dentro del documento: por ejemplo //'p a' son todos los elementos  que están dentro de un //
 * Dos maneres de indicar una selección
 * $(//selector//)
 * jQuery(//selector//)
 * Ejemplo prácticos de //selector//
 * **tag**: todos esos //tag//
 * .clase : todos los tags con esa //clase//
 * **tag.clase**: todos los tags de tipo //tag// con esta //clase//
 * #idname : todos los tags con este //idname (//en realidad debería ser solo uno//)//
 * ojo: no debería haber un id repetido. Por eso para escojer varios elementos, mejor señalarlos con una clase.
 * **tag[id='//idname']//**//: el tag con ese id//
 * por orden
 * $("input:first"): el primer 'input'en el body (ojo si hay master pages)
 * $("h2:eq(1)"): el segundo 'h2 (pues se empieza en el 0)'
 * para los . Hay que indicar el tipo
 * $(":checkbox:last").attr({checked:'true'}) marca el último checkbox
 * visibles o escondidos
 * :hidden / :visible

code alert($('img').attr('alt')); code
 * Ejemplos de obtener**
 * mostrar el atributo alt de la primera **imagen** ( tag ) del documento
 * ojo si se usan master pages

code format="html4strict" function saludar{ var nombre = $('form.formulario #campoNombre').val; alert(“Hola “+ nombre); }  Escribe tu nombre:   code
 * Ejemplo de obtener un valor dentro de un formulario**

code format="jquery" function saludar { //JS: var nombre = document.getElementById('campoNombre1').value //JS: document.getElementById('campoNombre2').value = nombre var nombre = $('#campoNombre1').val; $('#campoNombre2').val(nombre) } Escribe tu nombre:    code
 * Ejemplo de asignar un valor dentro de un formulario**

code format="jquery" valor = $("input[type=radio]:checked").val; alert(valor)   
 * Ejemplo de conocer los valores de un checkbox o un radiobutton de un formulario**

code para los checkbox hay que hacer un bucle para recorrerlos code format="jquery" valores = $("input[type=checkbox]:checked"); valores.each(function { alert($(this).val); });    code

code $("div.clase1").hide.addClass("clase2"); code code $("#p1").html("pongo texto al elemento"); code code $("#img1").attr( {width: "100", height: "100" }); code
 * Ejemplos de modificar**
 * **todos los div con la** clase 'clase1' se esconderán y se les cambiará la clase a 'clase2'
 * poner el 'texto' al elemento (por ejemplo a un )
 * cambia los atributos de una imagen

code $("form:first").validate; code
 * Otros ejemplos**
 * Valida los campos del primer formulario
 * ver mas ejemplos


 * Tipos de selectores**



=$(this)= Identifica el último elemento (tag) con el que jQuery acaba de interactuar

=Anidamineto de elementos=
 * Un elemento dentro de otro elemento es su hijo
 * El elemento exterior de un elemento es su padre

=Resumen= Tutorial: @http://api.jquery.com/category/selectors/

Ejemplos de selectores por orden
code format="html4strict" $(document).ready(function {        $("input:eq(1)").val("1");        $("input:last").val("nueve");        $(".cinput:gt(1)").val("4-5");    });

<%-- ya existe en la master page--%> 1

2

3<input type="text" id="Text3" />

4<input type="text" class="cinput" id="Text4" />

5<input type="text" class="cinput" id="Text5" />

6<input type="text" id="Text6" />

7<input type="text" id="Text7" />

8<input type="text" id="Text8" />

9<input type="text" id="Text9" />

code