jQuery, una libreria JavaScript per applicazioni Web
Potremmo iniziare il presente articolo dandovi subito e nell’immediato quelle che sono le prerogative della libreria JavaScript di jQuery, ma di contro non avremmo modo di parlarvi di quanto essa sia in grado di facilitare la vita di qualsiasi programmatore, lo faremo partendo proprio da quello che è lo slogan della jQuery Foundation “Write less, do more”, ovvero, dalla traduzione in italiano, “scrivi di meno, fai di più!”.
Da questo slogan si evince perfettamente quella che è la filosofia tecnico-funzionale della libreria jQuery, ovvero mettere a disposizione degli sviluppatori una vera e propria cassetta degli attrezzi contenente una miriade di utensili che racchiudono in essere quelle che sono potentissime funzioni in grado di essere eseguite senza dover obbligatoriamente andar a scrivere interamente il codice JavaScript, riassumendo il tutto in pochi comandi in grado di sviluppare quelle che altrimenti sarebbero delle vere e proprie pagine di funzioni.
Come già specificato jQuery è a tutti gli effetti una libreria JavaScript realizzata per applicazioni web e distribuita come software di natura libera sotto le prerogative di licenza MIT.
Prende forma con l’obiettivo di semplificare la vita degli sviluppatori gestendo con pochi e semplici comandi la selezione, la manipolazione, la gestione degli eventi e l’animazione di tutti quegli elementi visivi nel DOM relative alle pagine prodotte nel linguaggio di markup HTML, nonchè semplificare l’uso delle potenzialità di Ajax, garantendo una corretta manipolazione degli stili prodotti in CSS.
Struttura / API del framework
Il framework jQuery, come spesso citato fornisce degli attrezzi che possiamo definire metodi e funzioni per gestire nel migliore dei modi aspetti grafici e strumentali come ad esempio il posizionamento dei vari elementi, gli effetti sul click, i focus, i movimenti e tutta quella parte riguardante la manipolazione del DOM (document object model) mantenendo inalterata la compatibilità coi browser.
Quest’ultimi vengono gestiti dall’interprete JavaScript del browser stesso e possiamo dividere gli elementi della libreria nelle fasi che vi andiamo ad elencare.
Core
- I costrutti di utilizzo della libreria;
– Ottenere gli elementi mediante un selettore;
– Ottenere un elemento tramite una referenza di parametro;
– Creare un elemento del tutto nuovo tramite HTML grezzo. - I metodi e le proprietà per accedere agli elementi;
– Conoscere il numero di elementi ( size() o lenght() );
– Duplicare ogni elemento tramite funzione ( each() );
– Conoscere il selettore utilizzato o l’elemento presente sul DOM ( selector o context );
– Ottenere e manipolare elementi nativi ( get() index() ); - I metodi per creare e utilizzare le liste e le code;
- I metodi per l’estrazione del framework mediante le plugin;
- I metodi per eseguire le animazioni mediante le funzioni ( show(), hide(), animate() ).
Selettori
I selettori sono gli strumenti utilizzati per reclamare l’accesso agli elementi HTML della pagina.
- Selezionare un elemento sfruttandone l’id (#id);
- Selezionare uno o più elementi in base alla classe (.classe/div.classe);
- Selezionare in modo gerarchico mediante l’utilizzo di parole chiavi;
- Selezionare relativamente ad una pseudo classe ( :first, :not, :last );
- Sezionare mediante gli attributi o i contenuti ( :hidden, :has );
Attributi
Gli attributi sono ricavati o manipolati in maniera differente relativamente al browser a seconda se un parametro sia specificato o meno.
- Attributo generico ( attr() );
- Per classi
– Per leggere la classe ( hasClass() );
– Per attribuire o rimuovere una classe ( addClass(), removeClass(), toggleClass() ). - Per contenuto;
– Per codice ( html() );
– Per contenuto testuale ( text() );
– Per valore ( val() ). - Per manipolazione;
– Per aggiungere o rimuovere elementi nel DOM;
– Per sostituire elementi nel DOM.
CSS
Per controllare gli artefatti grafici in maniera semplificata.
- Cambiare, aggiungere o rimuovere proprietà grafiche
- Per leggere, ottenere e sostituire proprietà grafiche;
– Gestire lo scroll;
– Manipolare le dimensioni ( height e width );
Eventi
Grazie all’utilizzo del framework jQuery saremmo in grado di riconoscere gli oggetti di tipo event tramite l’assegnazione quali: click, load, mousehover, mouseleave.
Ajax
Ajax permette la gestione delle chiamate asincrone in maniera semplificata.
- Per caricare contenuti dinamici;
– Funzione di caricamento;
– Funzione di caricamento di codice HTML. - Eseguire richieste di tipo asincrono ( GET e POST );
- Interazione con il linguaggio nativo Javascript;
– Caricamento oggetti json;
– Caricare un file javascript.
In conclusione
Nonostante alle spalle del framework creato dalla fondazione jQuery ci sia molta più roba di quanto ve ne stiamo parlando risulta quasi impossibile riassumere il tutto all’interno di un nostro semplice articolo che non vanta alcuna pretesa di insegnare, ma grazie a questo siamo certi che possiate illuminarvi su quanto risulti indispensabile, ad oggi, l’utilizzo di jQuery durante la fase di realizzazione di un sito web, e noi di eXceed Srl siamo ben consapevoli di quanto questa libreria possa agevolarvi soprattutto riducendo i tempi di sviluppo e architettura.
La realizzazione siti internet o la realizzazione e-commerce prevedono una serie di macchinose funzioni che si coordinano e si affiancano fra loro per dar vita a quello che dal di fuori appare semplicemente come un’interfaccia utente, ma che alle spalle prevede ore, giorni se non mesi di lavoro, e per questo risulta indispensabile l’utilizzo di librerie / framework come quelle offerte da jQuery.
Per concludere questo articolo ci torna necessario dover fare alcune precisazioni definendole menzioni speciali, in quanto il mondo di jQuery e così ampio e vasto che non termina nel solo utilizzo del framework principale ma di fatto prevede tanti sotto framework ampiamente utilizzati dai programmatori web e dai programmatori desktop o mobile, ne menzioniamo alcuni: jQuery UI/UX, jQuery Fire, jQuery Mobile…
Articoli correlati
