MDN wants to learn about developers like you: https://qsurvey.mozilla.com/s3/MDN-dev-survey

Esta tradução está incompleta. Por favor, ajude a traduzir este artigo.

A interface DOMTokenList  representa um set de tokens separados por espaço. Tais sets são retornados por Element.classList, HTMLLinkElement.relList, HTMLAnchorElement.relList ou HTMLAreaElement.relList. É indexada começando com 0 assim como os objetos tipo Array JavaScript. DOMTokenList é sempre case-sensitive.

Properties

DOMTokenList.length Somente leitura
É um inteiro representando o número de objetos armazenados no objeto.
DOMTokenList.value Somente leitura
Retorna o valor da lista como um DOMString.

Methods

DOMTokenList.item()
Retorna um item da lista pelo seu index (retorna undefined se o número é maior ou igual ao comprimento da lista).
DOMTokenList.contains()
Retorna true se a lista contém o token especificado, caso contrário false.
DOMTokenList.add()
Adiciona o token em especificado à lista.
DOMTokenList.remove()
Remove o token especificado da lista.
DOMTokenList.replace()
Substitui  um token exsitente por um novo token.
DOMTokenList.supports()
Retorna true se um token especificado está na lista de tokens suportados pelos atributos associados.
DOMTokenList.toggle()
Remove um determinado token da lista e retorna false. Se o token não esiste, é adicionado e a função retorna true.
DOMTokenList.entries()
Retorna um iterator permitindo que se percorra todas os pares chave/valor contidos nesse objeto.
DOMTokenList.forEach()
Executa uma função especificada para cada elemento no DOMTokenList.
DOMTokenList.keys()
Retorna um iterator permitindo que se percorra todas as chaves dos pares chave/valor contidos nesse objeto.
DOMTokenList.values()
Retorna um iterator permitindo que se percorra todos os valores dos pares chave/valor contidos nesse objeto.

Examples

In the following simple example we retrieve the list of classes set on a <span> element as a DOMTokenList using Element.classList, add a class using DOMTokenList.add(), and then update the Node.textContent of the <span> to equal the DOMTokenList.

First, the HTML:

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

Now the JavaScript:

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

The output looks like this:

Trimming of whitespace and removal of duplicates

Methods that modify the DOMTokenList (such as DOMTokenList.add()) automatically trim any excess whitespace and remove duplicate values from the list. For example:

<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 + '"';

The output looks like this:

Specifications

Specification Status Comment
Credential Management Level 1 Rascunho editorial Adds the supports() method.
DOM
The definition of 'DOMTokenList' in that specification.
Padrão em tempo real Initial definition

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support (Yes) (Yes) 10 (Yes) (Yes)
replace() 61 49 (49) ? Não suportado (Yes)
Iterable methods (entries(), keys(), forEach(), values()) (Yes) 50 (50) ? (Yes) ?
supports() 50 49 (49) Não suportado (Yes) ?
Remove whitespace and duplicates (Yes) 55 (55) (Yes)[1] (Yes) (Yes)
Feature Android Webview Chrome for Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support (Yes) (Yes) (Yes) (Yes) ? (Yes)
replace() ? Não suportado 49.0 (49) ? Não suportado (Yes)
Iterable methods (entries(), keys(), forEach(), values()) ? (Yes) 50.0 (50) ? (Yes) ?
supports() 50.0 50.0 49.0 (49) Não suportado Não suportado Não suportado
Remove whitespace and duplicates ? (Yes) 55.0 (55) (Yes)[1] (Yes) (Yes)

[1] IE only trims whitespace — it doesn't remove duplicates.

See Also

Etiquetas do documento e colaboradores

 Colaboradores desta página: zenithpolar
 Última atualização por: zenithpolar,