Javascript Ogni Funzione

| | | | | | | | | | | | | | | | | | | | | |

jQuery each() è un modo conciso per scorrere gli elementi DOM. Il metodo Each() è progettato per essere chiamato sull’oggetto jQuery di destinazione. Un oggetto jQuery è un oggetto che contiene uno o più elementi DOM e ha accesso ai metodi jQuery. Non solo each() è meno soggetto a errori, ma semplifica la manipolazione di più elementi DOM.

jQuery each() richiede una funzione di callback ‚Äî una funzione passata a un’altra funzione che verrà eseguita in seguito. All’interno della funzione di callback c’è l’accesso al numero di indice dell’elemento e all’elemento stesso. Una revisione più completa delle funzioni di callback può essere trovata qui.

L’applicazione di each() è semplice come qualsiasi ciclo JavaScript, ma ci sono alcuni posti per la potenziale confusione. Faremo chiarezza su questi punti e esamineremo la sintassi. Alla fine di questa guida ci saranno esempi di codice passo passo per vedere diversi modi per applicare jQuery each().

Cos’è jQuery each()?

jQuery ciascuno è un metodo di ciclo per la libreria jQuery. Funziona come un ciclo JavaScript iterando su elementi DOM. jQuery each() richiede una funzione di callback, e all’interno della funzione di callback è dove gli elementi DOM possono essere manipolati.

Mentre all’interno del corpo della funzione di callback, condizionale le istruzioni possono essere utilizzate per modificare alcuni degli elementi selezionati. Le dichiarazioni condizionali sono istruzioni if‚Ķthen in JavaScript. Ciò fornisce un livello più profondo di controllo su come esattamente gli elementi vengono modificati.

Sintassi jQuery each()

jQuery each può essere invocato in due modi. Innanzitutto, come metodo chiamato su un elemento selezionato. La funzione di callback accetta fino a due argomenti facoltativi: indice e valore. Indice è il numero di indice dell’elemento corrente. Se l’elemento corrente fosse il primo nell’elenco, il numero di indice restituirebbe 0.

L’argomento value si riferisce all’elemento corrente. è importante notare che per concatenare un metodo al valore è necessario avvolgere il valore in un selettore jQuery. Mettiamo tutto questo in un codice astratto cosi possiamo scomporre la sintassi.

Qui selezioniamo ogni

Ricorda che [oggetto Oggetto] è una rappresentazione di stringa di un oggetto. Ciò significa che dobbiamo chiamare un metodo per estrarre il valore esatto che vogliamo. Nel caso sopra, stiamo usando il metodo text() per rivelare l’attributo text dell’oggetto. Ulteriori informazioni su [oggetto oggetto] per avere un’idea di cosa viene esattamente restituito.

L’esempio precedente registrerà il numero di indice seguito dall’attributo di testo per ogni

Scrivendolo in questo modo si registra il testo dell’attuale

Questa guida copre i dettagli delle funzioni freccia.

Esempi jQuery each()

Espandiamo gli esempi di sintassi sopra e aggiungiamo alcuni attributi. Iniziamo con un rendering HTML di base di un elenco di colori appartenenti a varie classi.

Questo esegue il rendering di ogni elemento di testo nel DOM. Innanzitutto, iniziamo semplicemente registrando il testo nella console utilizzando entrambe le funzioni freccia e una funzione tradizionale.

Selezionando solo selezionato elementi.

Restituiamo gli stessi risultati, ma utilizzando la parola chiave this.

Possiamo usare una funzione anonima ‚Äî una funzione senza nome, come il callback. Di nuovo, restituisce il testo Red, Purple e Blue. Vale la pena ricordare che sebbene le funzioni freccia abbiano alcune funzionalità in jQuery, è consigliabile utilizzare la tradizionale notazione funzionale per i callback jQuery.

Ora sappiamo come scorrere una raccolta di elementi. Ora divertiamoci un po’ e cambiamo colore!

.colorSelect { colore: blu; } .verde { colore: verde; }

Seguendo la pagina dell’elenco dei colori, ora abbiamo aggiunto alcune classi alla pagina