jQuery selectors

In questo breve tutorial parleremo di jQuery selectors, ovvero dei selettori nelle jQuery.

Abbiamo già visto nella lezione precedente come si utilizzano i selettori ma non abbiamo citato i tre selettori particolari:

$(document) è il selettore che indica l’intero documento HTML.

$(this) è il selettore che indica l’elemento HTML corrente.

$(“*”) è il selettore che indica tutti gli elementi di una pagina HTML. Infatti * sta ad indicare all.


Altri JQuery selectors

Citiamo altri selettori che solitamente vengono utilizzati.

$(“p:first”) è utile perché in una pagina web ci possono essere tanti elementi con il tag p. Allora, se ad esempio volessimo selezionare il primo paragrafo dovremmo indicare il termine first separato tal tag p dai due punti.

La stessa cosa è possibile fare ad esempio per gli elenchi puntati e numerati.

Ad esempio $(“ul li:first”) indica la prima voce dell’elenco puntato.

Allo stesso modo si può utilizzare last per indicare l’ultimo elemento dell’elenco puntato.

Invece ad esempio $(“ul li:first-child”) indica la prima voce di tutti gli elementi li.

Così come first-child indica il primo elemento, last-child si può utilizzare allo stesso modo, ma indica l’ultimo elemento.

Continuiamo a parlare di jQuery selectors.

Se vogliamo selezionare tutti i tag h1, h2,…,h6 possiamo utilizzare $(“:header”).

Ma se dalla selezione volessimo escludere ad esempio tutti i tag h2 allora dovremmo indicare $(“:header:not(h2)”).

Se ancora, ad esempio, volessimo selezionare tutti i tag div che all’interno hanno dei paragrafi dovremmo utilizzare $(“div:has(p)”).

Insomma ci sono tantissimi selettori, se volete potete consultare un elenco delle jQuery selectors al seguente link: w3school.


Non vi preoccupare, queste due lezioni sono state un pò teoriche ma già dalla prossima vedremo tanti esempi, per cui sarà molto semplice utilizzare le jQuery selectors.

Alcuni link utili

Indice argomenti tutorial jQuery

Rimuovere attributi agli elementi del DOM con JavaScript

Creare attributi agli elementi

Creare elementi nel dom con javascript

Dom in javascript

Come creare una galleria di immagini con javascript

Utilizzare gli array in javascript

Saper utilizzare il metodo getElementById

Autore dell'articolo: Cristina

Avatar per Coding Creativo

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *