English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
I selettori jQuery ti permettono di scegliere e manipolare gli elementi HTML.
Questa sezione contiene l'elenco completo dei selettori del library JavaScript jQuery più recente.
Tutti i selettori sono divisi in alcune categorie.
| Selettore | Esempio | Spiegazione |
|---|---|---|
| * | $("*") | Scegliere tutti gli elementi (selettore universale) |
| #id | $("#demo") | Scegliere un elemento con id="demo" |
| .class | $(".demo") | Scegliere tutti gli elementi con class="demo" |
| elemento | $("p") | Scegliere tutti gli elementi <p> |
| selector1, selector2 | $("p, div") | Scegliere tutti gli elementi <p> e tutti gli elementi <div> |
| Selettore | Esempio | Spiegazione |
|---|---|---|
| ancestor descendant | $("div p") | Scegliere tutti gli elementi <p> all'interno di un elemento <div> |
| parent > child | $("div > p") | Scegliere tutti gli elementi <p> i cui elementi genitori sono <div> |
| prev + next | $("div + p") | Scegliere tutti gli elementi <p> che seguono immediatamente un elemento <div> |
| prev ~ siblings | $("div ~ p") | Scegliere tutti gli elementi <p> che sono同级 di un elemento <div> |
| Selettore | Esempio | Spiegazione |
|---|---|---|
| [attribute] | $("[target]") | Scegliere tutti gli elementi con l'attributo target |
| [attribute=value] | $("a[href='CSS3']") | Scegliere tutti gli elementi <a> con un valore dell'attributo href uguale a "CSS3" |
| [attribute!=value] | $("a[href!='CSS3']") | Scegliere tutti gli elementi <a> con un valore dell'attributo href diverso da "CSS3" |
| [attribute~=value] | $("[alt~=Parrot]") | Scegliere tutti gli elementi con l'attributo alt che contengono la parola "Parrot" |
| [attribute|=value] | $("[lang|=en]") | Scegliere tutti gli elementi con un valore dell'attributo lang che inizia con "en" |
| [attribute^=value] | $("a[href^=https]") | Scegliere ogni elemento <a> il cui valore dell'attributo href inizia con "https" |
| [attribute$=value] | $("a[href$='.org']") | Scegli ogni elemento <a> il cui valore dell'attributo href termina con " .org" |
| [attributo*=valore] | $("a[href*=example]") | Scegli ogni elemento <a> il cui valore dell'attributo href contiene la sottostringa "example" |
| Selettore | Esempio | Spiegazione |
|---|---|---|
| :first | $("p:first") | Scegli il primo elemento <p> |
| :last | $("p:last") | Scegli l'ultimo elemento <p> |
| :even | $("tr:even") | Scegli tutti gli elementi <tr> con un indice zero che sono numeri pari |
| :odd | $("tr:odd") | Scegli tutti gli elementi <tr> con un indice zero che sono numeri dispari |
| :not() | $("p:not(.demo)") | Scegli tutti gli elementi <p> tranne quelli con class="demo" |
| :eq() | $("tr:eq(2)") | Scegli il terzo elemento <tr> partendo dall'indice zero nella raccolta di corrispondenze |
| :lt() | $("tr:lt(5)") | Scegli tutti gli elementi <tr> con un numero di indice inferiore a 5, partendo da zero |
| :gt() | $("tr:gt(5)") | Scegli tutti gli elementi <tr> con un numero di indice superiore a 5, partendo da zero |
| :header | $":header") | Selettore di intestazione |
| :lang() | $("div:lang(en)") | Scegli tutti gli elementi <div> che hanno un valore di lingua "en", ovvero lang="en", lang="en-us" ecc. |
| :root | $":root") | Scegli l'elemento radice del documento, che è sempre l'elemento <html> del documento HTML |
| :animated | $":animated") | Il selettore esegue la selezione di tutti gli elementi animati durante l'esecuzione del selettore |
| Selettore | Esempio | Spiegazione |
|---|---|---|
| :first-child | $("p:first-child") | Scegli tutti gli elementi <p> che sono il primo figlio del loro genitore |
| :last-child | $("p:last-child") | Scegli tutti gli elementi <p> che sono l'ultimo figlio del loro genitore |
| :only-child | $("p:only-child") | Scegli tutti gli elementi <p> che sono unici figli del loro genitore |
| :first-of-type | $("p:first-of-type") | Scegli tutti gli elementi <p> che appartengono al primo figlio del loro genitore |
| :last-of-type | $("p:last-of-type") | Seleziona tutti gli elementi <p> che appartengono all'ultimo <p> del genitore |
| :only-of-type | $("p:only-of-type") | Seleziona tutti gli elementi <p> che non hanno同级 e hanno lo stesso nome di elemento |
| :nth-child(n) | $("p:nth-child(3)") | Seleziona tutti gli elementi <p> che sono il terzo figlio del genitore |
| :nth-last-child(n) | $("p:nth-last-child(4)") | Seleziona tutti gli elementi <p> che sono il quarto figlio dell'elemento genitore, contando dall'ultimo elemento al primo |
| :nth-of-type(n) | $("span:nth-of-type(3)") | Seleziona tutti gli elementi <span> che appartengono al terzo <span> del genitore |
| :nth-last-of-type(n) | $("span:nth-last-of-type(4)") | Seleziona tutti gli elementi <span> che appartengono al quarto <span> dell'elemento genitore, contando dall'ultimo elemento al primo |
| Selettore | Esempio | Spiegazione |
|---|---|---|
| :contains() | $("p:contains('is')") | Seleziona tutti gli elementi <p> che contengono il testo "is" |
| :empty | $(":empty") | Seleziona tutti gli elementi vuoti, ossia senza elementi figli (incluso il testo) |
| :has() | $("p:has(span)") | Seleziona tutti gli elementi <p> che contengono almeno un elemento <span> |
| :parent | $(":parent") | Seleziona tutti gli elementi che hanno almeno un nodo figlio (elemento o testo) |
| Selettore | Esempio | Spiegazione |
|---|---|---|
| :input | $(":input") | Seleziona tutti gli elementi di input, aree di testo, selettori e pulsanti |
| :text | $(":text") | Seleziona tutti gli elementi di input di tipo "text" |
| :password | $(":password") | Seleziona tutti gli elementi di input di tipo "password" |
| :radio | $(":radio") | Seleziona tutti gli elementi di input di tipo "radio" |
| :checkbox | $(":checkbox") | Seleziona tutti gli elementi di input di tipo "checkbox" |
| :button | $(":button") | Seleziona tutti gli elementi di input e pulsanti di tipo "button" |
| :submit | $(":submit") | Seleziona tutti gli elementi di input e pulsanti di tipo "submit" |
| :reset | $(":reset") | Seleziona tutti gli elementi di input e pulsanti di tipo "reset" |
| :image | $(":image") | Seleziona tutti gli elementi di input di tipo "image" |
| :file | $(":file") | Seleziona tutti gli elementi di input di tipo "file" |
| :enabled | $(":enabled") | Seleziona tutti gli elementi abilitati |
| :disabled | $(":disabled") | Seleziona tutti gli elementi disabilitati |
| :selected | $(":selected") | Seleziona tutti gli elementi selezionati, applicabile solo agli elementi <option> |
| :checked | $(":checked") | Seleziona tutti gli elementi selezionati o selezionabili, applicabile a caselle di controllo, pulsanti radio e elementi di selezione |
| :focus | $(":focus") | Seleziona l'elemento attualmente in stato di focus |
| Selettore | Esempio | Spiegazione |
|---|---|---|
| :hidden | $("p:hidden") | Seleziona tutti gli elementi <p> nascosti |
| :visible | $("p:visible") | Seleziona tutti gli elementi <p> visibili |