Javascript » JQuery
JQuery è un framework per utilizzare funzioni avanzate di javascript in modo semplice e senza dover reinventare la ruota. In che senso?
Il motto con cui JQuery si presenta è infatti "Write Less Do More", cioè fai più cose scrivendo meno. Le cose stanno così: la libreria che includeremo all'inizio delle nostre pagine contiene una serie di funzioni e oggetti che ci permettono di eseguire operazioni complesse e gestire eventi sugli oggetti della pagina con poche righe di codice.
Il framework permette di gestire il posizionamento di elementi, effetti su immagini, manipolazione del DOM e molto altro, sempre utilizzando gli standard e senza doversi preoccupare delle problematiche dovute alle differenze tra browser.
La selezione degli oggetti delle pagine si basa sulla stessa tecnica usata nei CSS:
$("td")
equivale a selezionare tutte le celle di tutte le tabelle della pagina;$("tr#x2 td")
selezionerà invece le celle relative alla riga (tag<tr>
) conid="x2"
;$("table#pr tr.disp td.f")
seleziona le celle conclass="f"
appartenenti alle righe conclass="disp"
dentro la tabella conid="pr"
Cosa fare degli oggetti?
Ovviamente è possibile cambiare qualunque cosa del documento html che abbiamo nel browser; è possibile:
- leggere il contenuto di un oggetto. Nel caso di una cella con
id="C3"
:variabile=$("td#C3").html();
- modificare il contenuto di un oggetto. Nel caso di una cella con id="a12":
$("td#a12").html("Nuovo contenuto della cella");
- associare un evento a un oggetto. Al clic sulle celle mostrane il contenuto con un alert:
$("td").on("click", function(){ alert($(this).html()) });
Questi sono ovviamente esempi molto basilari e di semplice comprensione, ma è possibile progettare script estremamente potenti e performanti senza scrivere centinaia di righe di codice. Non abbiamo che sfiorato appena la superficie del mondo di jQuery.
Provate a scaricarlo e consultare la documentazione on-line sul sito ufficiale.