L'interfaccia DOMTokenList rappresenta un insieme di token separati dallo spazio. Tale insieme viene restituito da Element.classList, HTMLLinkElement.relList, HTMLAnchorElement.relList, HTMLAreaElement.relList, HTMLIframeElement.sandbox, o HTMLOutputElement.htmlFor. Viene indicizzato a partire da 0 come con gli JavaScript Array oggetti. DOMTokenList è sempre case-sensitive.

Proprietà

DOMTokenList.length Read only
È un integer che rappresenta il numero di oggetti memorizzati nell'oggetto.
DOMTokenList.value
Il valore della lista come una DOMString.

Metodi

DOMTokenList.item()
Restituisce un elemento nell'elenco per il suo indice (restituisce undefined se il numero è maggiore o uguale alla lunghezza dell'elenco).
DOMTokenList.contains()
Restituisce true se la lista contiene il token dato, altrimenti false.
DOMTokenList.add()
Aggiunge il token indicato alla lista.
DOMTokenList.remove()
Rimuove il token specificato dall'elenco.
DOMTokenList.replace()
Sostituisce un token esistente con un nuovo token.
DOMTokenList.supports()
Restituisce true se un determinato token si trova nei token supportati dell'attributo associato.
DOMTokenList.toggle()
Rimuove un determinato token dall'elenco e restituisce false. Se il token non esiste viene aggiunto e la funzione restituisce true.
DOMTokenList.entries()
Restituisce un iterator consentendoti di passare attraverso tutte le coppie chiave/valore contenute in questo oggetto.
DOMTokenList.forEach()
Esegue una funzione fornita una volta per elemento DOMTokenList.
DOMTokenList.keys()
Restituisce un iterator consentendo di esaminare tutte le chiavi delle coppie chiave/valore contenute in questo oggetto.
DOMTokenList.values()
Restituisce un iterator consentendo di esaminare tutti i valori delle coppie chiave/valore contenute in questo oggetto.

Esempi

Nel seguente semplice esempio, recuperiamo l'elenco di classi impostato su un elemento <p> come una DOMTokenList usando Element.classList, aggiungi una classe usando DOMTokenList.add(), quindi aggiorna il Node.textContent di <p> per uguagliare DOMTokenList.

Innanzitutto, l'HTML:

<p class="a b c"></p>

Ora JavaScript:

var para = document.querySelector("p");
var classes = para.classList;
para.classList.add("d");
para.textContent = 'paragraph classList is "' + classes + '"';

L'output è simile a questo:

Taglio di spazi bianchi e rimozione di duplicati

I metodi che modificano DOMTokenList (come DOMTokenList.add()) tagliano automaticamente gli spazi bianchi in eccesso e rimuovono i valori duplicati dall'elenco. Per esempio:

<span class="    d   d e f"></span>
var span = document.querySelector("span");
var classes = span.classList;
span.classList.add("x");
span.textContent = 'span classList is "' + classes + '"';

L'output è simile a questo:

Specificazioni

Specificazione Stato Commento
DOM
The definition of 'DOMTokenList' in that specification.
Living Standard Initial definition

Compatibilità con i browser

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
DOMTokenListChrome Full support 1Edge Full support YesFirefox Full support YesIE Full support 10Opera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support YesOpera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
replaceChrome Full support 61Edge Full support 17Firefox Full support 49IE ? Opera Full support 48Safari Full support YesWebView Android Full support 61Chrome Android Full support 61Firefox Android Full support 49Opera Android Full support 45Safari iOS Full support YesSamsung Internet Android No support No
supports
Experimental
Chrome Full support 49Edge Full support 17Firefox Full support 49IE No support NoOpera Full support 36Safari Full support YesWebView Android Full support 49Chrome Android Full support 49Firefox Android Full support 49Opera Android Full support 36Safari iOS No support NoSamsung Internet Android Full support 5.0
Trimming of whitespace and removal of duplicatesChrome Full support YesEdge ? Firefox Full support 55IE Full support Yes
Notes
Full support Yes
Notes
Notes IE only trims whitespace - it doesn't remove duplicates.
Opera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 55Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
lengthChrome Full support 1Edge Full support 12Firefox Full support 50IE ? Opera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 50Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
valueChrome Full support 50
Notes
Full support 50
Notes
Notes Before Chrome 50, this property was part of the deprecated child DOMSettableTokenList interface.
Edge Full support YesFirefox Full support YesIE ? Opera Full support 37
Notes
Full support 37
Notes
Notes Before Opera 37, this property was part of the deprecated child DOMSettableTokenList interface.
Safari Full support YesWebView Android Full support 50
Notes
Full support 50
Notes
Notes Before Chrome 50, this property was part of the deprecated child DOMSettableTokenList interface.
Chrome Android Full support 50
Notes
Full support 50
Notes
Notes Before Chrome 50, this property was part of the deprecated child DOMSettableTokenList interface.
Firefox Android Full support YesOpera Android Full support 37
Notes
Full support 37
Notes
Notes Before Opera 37, this property was part of the deprecated child DOMSettableTokenList interface.
Safari iOS Full support YesSamsung Internet Android Full support Yes
itemChrome Full support 1Edge Full support 12Firefox Full support YesIE Full support 10Opera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support YesOpera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
containsChrome Full support 1Edge Full support 12Firefox Full support YesIE Full support 10Opera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support YesOpera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
addChrome Full support 1Edge Full support 12Firefox Full support YesIE Full support 10Opera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support YesOpera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
removeChrome Full support 1Edge Full support 12Firefox Full support YesIE Full support 10Opera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support YesOpera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
toggleChrome Full support 1Edge Full support 12Firefox Full support YesIE Full support 11Opera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support YesOpera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
entriesChrome Full support 45Edge ? Firefox Full support 50IE ? Opera Full support 32Safari ? WebView Android Full support 45Chrome Android Full support 45Firefox Android Full support 50Opera Android Full support 32Safari iOS ? Samsung Internet Android Full support Yes
forEachChrome Full support 45Edge Full support 16Firefox Full support 50IE No support NoOpera Full support 32Safari ? WebView Android Full support 45Chrome Android Full support 45Firefox Android Full support 50Opera Android Full support 32Safari iOS ? Samsung Internet Android Full support Yes
keysChrome Full support 45Edge ? Firefox Full support 50IE ? Opera Full support 32Safari ? WebView Android Full support 45Chrome Android Full support 45Firefox Android Full support 50Opera Android Full support 32Safari iOS ? Samsung Internet Android Full support Yes
valuesChrome Full support 45Edge ? Firefox Full support 50IE ? Opera Full support 32Safari ? WebView Android Full support 45Chrome Android Full support 45Firefox Android Full support 50Opera Android Full support 32Safari iOS ? Samsung Internet Android Full support Yes

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
Experimental. Expect behavior to change in the future.
Experimental. Expect behavior to change in the future.
See implementation notes.
See implementation notes.

Guarda anche

Tag del documento e collaboratori

Hanno collaborato alla realizzazione di questa pagina: mdnwebdocs-bot, IsibisiDev
Ultima modifica di: mdnwebdocs-bot,