DOMTokenList

DOMTokenList.length (en-US) Только для чтения

- целое число, которое представляет собой число объектов хранящееся в объекте

DOMTokenList.value (en-US)

Список значений DOMString.

DOMTokenList.item() (en-US)

Возвращает элемент из списка по индексу (возвращает undefined если число больше или равно длине списка).

DOMTokenList.contains() (en-US)

Возвращает true если список содержит отданный токен, иначе false.

DOMTokenList.add() (en-US)

Добавляет отданный токен в список.

DOMTokenList.remove() (en-US)

Удаляет указанный токен из списка.

DOMTokenList.replace()

Заменяет существующий токен новым.

DOMTokenList.supports() (en-US)

Возвращает true если отданный токен поддерживается токенами в связанном атрибуте

DOMTokenList.toggle() (en-US)

Удаляет отданный токен из списка и возвращает false. Если токена не существует, то он добавляется и функция возвращает true.

DOMTokenList.entries() (en-US)

Возвращает iterator позволяя пройтись по всем парам ключ/значение хранящимся в объекте.

DOMTokenList.forEach() (en-US)

Выполняет предусмотренную функцию к каждому элементу DOMTokenList.

DOMTokenList.keys() (en-US)

Возвращает iterator позволяя пройтись по всем ключам всех пар ключ/значение, хранящихся в объекте.

DOMTokenList.values() (en-US)

Возвращает iterator позволяя пройтись по всем значениям пар ключ/значение, хранящихся в объектах.

В следующем простом примере мы извлекаем список классов установленных в элементе <p> как DOMTokenList используя Element.classList, добавляем класс используя DOMTokenList.add() (en-US), затем обновляем Node.textContent в элементе <p> чтобы уравнять с DOMTokenList.

Сперва HTML:

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

Теперь JavaScript:

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

Результат выглядит так:

Метод, который модифицирует DOMTokenList (как DOMTokenList.add() (en-US)) автоматически обрезает все излишки Whitespace и удаляет значения дубликатов из списка. Пример:

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

Результат выглядит так:

• DOMSettableTokenList (объект который расширяет DOMTokenList с установленным .value параметром)