123

Ti è piaciuto? Condividi su social!



Introduzione a jQuery

jQuery è la libreria JavaScript, che contiene le funzioni pronti di JavaScript, tutte le operazioni di  jQuery vengono eseguite dal codice JavaScript.

La libreria jQuery esegue  manipolazioni con elementi HTML controllando il loro comportamento e utilizzano il DOM (Il DOM, come dice la parola stessa (Document Object Model) è un modello, ovvero un modo di rappresentare un documento )per cambiare la struttura della pagina web. Allo stesso tempo, i file HTML e CSS non vengono modificati, vengono apportate modifiche solo alla visualizzazione della pagina dal lato utente.

 

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

jQuery(document).ready(function() {
...
});

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:

$h = $(".list").parent().parent().detach();

Per memorizzare più elementi vengono utilizzati gli array(un gruppo di valori ) di JavaScript:

$k[3] = 15;

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:

Google CDN

Microsoft CDN

CDNJS CDN

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,

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

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:

<script src="/js/jquery-2.0.0.min.js"></script>

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:

$("img", 
{src: "images/flower.jpg",
title: "Rose_in_garden",
click: function() {...}
}).appendTo("body");

Questo codice di js crea un elemento <img> con gli attributi specificati ed esso viene incluso nella struttura di DOM.

Letto 541 volte

Potrebbe interessarti

Altro in questa categoria: « 15 plug-in jQuery per Bootstrap. Manipolare gli elementi HTML in jQuery »
Torna in alto