Per selezionare gli elementi, si utilizzano selettori CSS. La selezione viene effettuata tramite il simbolo di dollaro $ (). Quando viene richiamata la funzione $ () esso restituisce una nuova versione del elemento selezionato tramite selettori al interno di jQuery, modificando in tale modo la strutura VISIVA del DOM non cambiando i fail di origine .
Esecuzione di diversi scenari sia possibili solo dopo che la strutura del documento viene completamente caricata, dopo che il browser converte il codice HTML della pagine nella struttura DOM. Gestione del processo di caricamento prevede la costruzione
Questo codice dice che per la prima cosa il documento document viene avvolto nella funzione di jQuery() e dopo che il documento viene caricato con il metodo ready () ad esso (alla sua struttura di DOM ) viene applicata una funzione function() {...} , che sara eseguita dopo il caricamento completo del documento.
In pratica, viene utilizzata la forma abbreviata del codice che abbiamo visto sopra jQuery(function() {...});, o $(function() {...});.
Per memorizzare le informazioni durante il lavoro con la libreria jQuery vengono utilizzati variabili di JavaScript . In questi variabili possono essere memorizzati elementi. I nomi di variabili per memorizzare elementi cominciano con il simbolo $, ad esempio:
Per memorizzare più elementi vengono utilizzati gli array(un gruppo di valori ) di JavaScript:
Regole per lavorare con libreria jQuery
1. Come aggiungere jQuery su una pagina web
Aggiungere la libreria jQuery sulla tua pagina web sia possibile in due modi:
Utilizzare un file della versione jQuery ospitato su siti di Google , o il Microsoft o jQuery.com.
Questo metodo utilizza la “Rete di Distribuzione del Contento” (CDN, content distribution network ), vale a dire file di jQuery si trova su un altro sito web non sul vostro e quando un utente carica la vostra pagina con uno script jQuery la libreria jQuery sara caricata da quel sito e non dal vostro. I vantaggi evidenti di questo metodo - la riduzione del carico sul web server e il download di file accelerato proprio a causa di una fitta rete di server di distribuzione.
Per utilizzare questo metodo, si deve andare a uno dei link:
Dopo che passate ad uno di siti indicati dovrete semplicemente compiare il link del fail di jQuery e aggiungerlo alla tua pagina web tra i tag <script> ... </ script>. Di conseguenza, dovresti ottenere un codice del genere,
Caricare l'ultima versione della libreria jQuery dal sito ufficiale. Per fare questo è necessario andare all'indirizzo jQuery.com e selezionare la versione della libreria che vi interessa. Per caricamnto vengono offre due versioni di file di jQuery uno ridotto ridotto al minimo e quello non compresso. La dimensione del file non compresso è di circa 300 KB, contiene i commenti, quindi è meglio utilizzarlo per sviluppo e debug del codice.
Versione ridotta del file pesa circa 100Kb, al interno sono rimossi tutti i commenti e spazi non necessari, che accelera il caricamento di file dal browser.
Per scaricare è necessario fare clic sul link, e nella finestra che si apre, fare clic con il tasto destro e scegliere "Salva con nome ...". Dopo di che, inserire il file nella cartella corretta (di solito si usa per questo scopo cartella «js») e aggiungerlo alla tua pagina:
2. Le regole per agiunta della libreria di jQuery su una pagina
Posizionare collegamenti al file jQuery all'interno del tag <head>.
Inserire dei link a file jQuery, dopo collegamenti a stili CSS dato che spesso la libreria jQuery esegue manipolazione con gli stili di elementi sulla pagina web.
Posizionare gli altri script rachuisi nel tag <script> ... </ script> solo dopo collegamento al file della libreria di jQuery, se lo script utilizza la libreria jQuery.
3. Come creare un nuovo elemento HTML
Creare un elemento html vuoto, ad esempio un blocco, si possa in vari modi:
1) utilizzando la scritura abreviata $("<div>")
2) utilizzando la costruzione $ ( "<div> </ div>")
3) utilizzando la costruzione $ ( "<div />")
Tutti i tre metodi sono funzionanti , ma nonostante ciò, si raccomanda di inserire i tag di apertura e chiusura per indicare che l'elemento può contenere altri elementi.
Quando si crea un nuovo elementi al metodo $ (), è possibile passare un secondo parametro in forma di un oggetto JavaScript, che da attributi aggiuntivi all'elemento:
Questo codice di js crea un elemento <img> con gli attributi specificati ed esso viene incluso nella struttura di DOM.