la sitassi di jQuery gira intorno all'oggetto/funzione $
selettore CSS
$("selettore CSS");
var elementi = $("#mioId"); un oggetto jQuery contiene un riferimento all'elemento con id mioId
- universale * tutti gli elementi
$("*");
- selettori semplici tutte le combinazioni di tag, classi e id
$("a"); tutti i link nel documento
$("#blocco"); seleziona un singolo elemento con id "blocco"
$("a.external"); solo i link con classe "external"
- selettori gerarchici
$("#blocco a"); i link all'interno dell'elemento con id "blocco"
$("ul > li"); solo gli elementi lista diretti discendenti del tag ul
$("label + input"); tutti i tag input preceduti da un tag label
$("#prev ~ div"); tutti gli elementi div adiacenti ad un elemento id prev
- selettori per attributi
- $("tag[attributo='valore']"); tutti i tag con attributo indicato
esempio: tutti i link che si aprono in nuove finestre
$("a[target='_blank']");
- $("tag[attributo!='valore']"); tutti i tag senza attributo indicato
esempio: tutti i link che non si aprono in nuove finestre
$("a[target!='_blank']");
- $("tag[attributo^='valore']"); tag con atrributo che inizia per valore
esempio: link con titolo che inizia per "nuova"
$("a[title^='nuova']");
- $("tag[attributo$='valore']"); tutti i tag con attriibto che finisce per valore
esempio: link con titolo che finisce per "pagina"
$("a[title$='pagina']");
concatenazione
- $("tag[attributo$='valore'] [attributo$='valore']"); é possibile concatenare i tag
esempio:
$("a[target='_blank'][title='nuova pagina']");
esempio: tutti gli elementi con attributo class "miaClasse"
$(".miaClasse");
esempio: cerca una classe, un id e gli elementi di una specifica lista puntata
$(".miaClasse, #mioId, ul#mioMenu li");
funzioni
é possibile passare come argomento una funzione
$(function ()
{
....;
}
);
le istruzioni passate verranno lanciate "on DOM ready", cioè quando l'albero degli elementi HTML è stato caricato