Quasi tutta la programmazione con jQuery è basato sulla selezione di elementi per ulteriori manipolazioni.

Ci sono molti modi di selezionare gli elementi con jQuery. Tutti restituire una matrice di elementi (Array <element>).

Let's list di loro.

Selezione di base

• # ID. Elemento con data id. Solo uno degli elementi ha dato id in un documento. Esempio
  $("#primDiv").css("background-color","black");
• elemento. Selezionare l'elemento HTML. Esempio
  $("div").css("border","9px double red");
• . Classe. Elementi di una data classe. Esempio
  $(".destaque").css("fontWeight","bolder");
• . Classe.classe. Elementi che appartengono ad entrambe le classi. Esempio
  $(".destaque.especial").css("color","red");
• *. Tutti gli elementi. Esempio
  $("*").css("color","black");
• Combinazione di quanto sopra. I selettori possono essere combinati in modi diversi, separati da virgole. Esempio
  $("div,span,p.olho").css("margin","3px 0 0 0");

Gerarchia

La selezione può essere più preciso per dimostrare di gerarchia. Visualizzare le opzioni

• Crescente decrescente. Selezione di prole di un dato elemento. Esempio
  $("form label").css("color","gray");
• Padre> Figlio. Selezionando gli elementi figlio di un dato elemento. Esempio
  $("#conteudo > *") .css("border","2px solid green");
• Precedente + successiva. Fattore di selezione che porta ad un particolare elemento. Esempio
  $("label + input").css("border","1px dotted blue");
• Precedente ~ Brothers. Fratelli elementi di selezione, dopo un certo elemento. Esempio
  $("#inicio ~ div").css("color","aquamarine");

Filtri

Un altro modo per affinare la selezione è quello di utilizzare i filtri. Ecco un elenco di filtri:

• : In primo luogo. Primo elemento di selezione. Esempio
  $("tr:first").css("font-style","italic");
• : L'ultima. Inverso: prima
• : (Non selettore). Gli elementi filtranti, che non possono essere inserite in un selettore particolare. Esempio
  $("input:not(:checked) + span") .css("border","1px dotted darkSalmon");
• : Anche. Elementi con coppia di indice, considerato che l'indice inizia da zero. Esempio
  $("tr:even").css("background-color","lavender");
• : Strano. Inversa: anche
• : Eq (index). Dato elemento dal suo indice. Esempio
  $("td:eq(2)").css("background-color","MintCream");
• : Gt (index). Tutti gli elementi con indice maggiore di un certo valore. Esempio
  $("p:gt(1)").hide();
• : Lt (index). Inverso: gt (index)
• : Intestazione. Tutti gli elementi di intestazione. Esempio
  $(":header").css("color","navy");
• : Animati. Tutti gli elementi che vengono eccitati al momento della selezione.

Contenuti filtri

Oltre a filtrare le informazioni per sé, siamo in grado di creare filtri per i contenuti.

• : Contiene (testo). Selezionare gli elementi che contengono un testo specifico. Esempio
  $("p:contains('JQuery')").css("text-decoration","underline");
• : Vuoto. Selezionare gli elementi senza figli. Esempio
  $("td:empty").css("background-color","MediumOrchid");
• : Ha (selettore). Seleziona gli elementi che contengono almeno un elemento particolare che corrisponde al selettore informato. Esempio
  $("div:has(p)").addClass("grade");
• : Genitore. Seleziona gli elementi che sono elementi figlio. Esempio
  $("td:parent").hide();

Filtri di visibilità

Possiamo cambiare le proprietà di visibilità degli elementi. Visibilità filtri servono a selezionare gli elementi per la loro condizione di visibilità.

• : Nascosto: consente di selezionare le informazioni eliminate. Esempio
  $("div:hidden").show(2000);
• : Visibili. Inverso: hidden

Filtri attributi

Un altro modo per filtrare una selezione di elementi è la presenza, l'assenza o valori degli attributi degli elementi. Prendere in considerazione i metodi:

• [attribute]. Gli elementi che contengono un attributo. Esempio
  $("div[id]").css("color","lime");
• [attribute = value]. Elementi con l'attributo che ha dato valore. Esempio
  $("p[class='ocultar']").hide(3000);
• [attributo! = valore]. Gli elementi con attributo che non ha dato valore.
• [^ attributo = valore]. Elementi con l'attributo che inizia con certo valore. Esempio
  $("input[name^='req']").val("Requerido");
• [$ attributo = valore]. Elementi con l'attributo che termina con un certo valore.
• [attributo *= value]. Elementi con l'attributo che contiene certo valore.
• Questi filtri possono essere combinati come in questo esempio:
  $("input[type='text'][id]").css("color","Darkred");

Filtri di affiliazione

Un altro modo di filtraggio è la valutazione del rapporto di affiliazione tra gli elementi. Prendere in considerazione:

• : Nth-child (index / pari / dispari / equazione). Selezionare l'elemento n-esima di selezione per affiliazione o coppie di elementi, pari o dispari secondo un'equazione. Esempio
  $("ol li:nth-child(2)").css("background-color","Bisque");
• : Il primo figlio. Primo figlio di una selezione.
• : Last-child. Inverso: first-child
• : Solo bambino. Seleziona tutti gli elementi che sono solo i figli dei loro elementi padre.

Elementi di forma

Possono anche essere selezionati per tali elementi

• : Ingresso
• : Il testo
• : Password
• : Radio
• : Checkbox
• : Submit
• : Image
• : Reset
• : Pulsante
• : File

Si consideri questo esempio:

$("form :checkbox").css("border","2px solid LightSlateGray");

Stato di elementi di forma

Gli elementi di forma può essere la sua raffinata selezione da parte dello Stato di questi elementi. Esempi

• : Abilitato
• : Disabilitato
• : Controllati
• : Selezionati

Un esempio di uso sarebbe

alert($("input:checked").length + " selecionados");