DOMTokenList

DOMTokenList интерфейс представляет собой набор разделённых пробелами токенов. Такой набор возвращается от Element.classList, HTMLLinkElement.relList, HTMLAnchorElement.relList, HTMLAreaElement.relList, HTMLIframeElement.sandbox, или HTMLOutputElement.htmlFor. Он в начале индексируется 0 как в объектах JavaScript.  DOMTokenList всегда чувствителен к регистру.

Свойства

DOMTokenList.length Только для чтения
- целое число, которое представляет собой число объектов хранящееся в объекте
DOMTokenList.value
Список значений  DOMString.

Методы

DOMTokenList.item()
Возвращает элемент из списка по индексу (возвращает undefined если число больше или равно длине списка).
DOMTokenList.contains()
Возвращает true если список содержит отданный токен, иначе false.
DOMTokenList.add()
Добавляет отданный токен в список.
DOMTokenList.remove()
Удаляет указанный токен из списка.
DOMTokenList.replace()
Заменяет существующий токен новым.
DOMTokenList.supports()
Возвращает true если отданный токен поддерживается токенами в связанном атрибуте
DOMTokenList.toggle()
Удаляет отданный токен из списка и возвращает false. Если токена не существует, то он добавляется и функция возвращает true.
DOMTokenList.entries()
Возвращает iterator позволяя пройтись по всем парам ключ/значение хранящимся в объекте.
DOMTokenList.forEach()
Выполняет предусмотренную функцию к каждому элементу DOMTokenList.
DOMTokenList.keys()
Возвращает iterator позволяя пройтись по всем ключам всех пар ключ/значение, хранящихся в объекте.
DOMTokenList.values()
Возвращает iterator позволяя пройтись по всем значениям пар ключ/значение, хранящихся в объектах.

Примеры

В следующем простом примере мы извлекаем список классов установленных в элементе <p> как DOMTokenList используя Element.classList, добавляем класс используя DOMTokenList.add(), затем обновляем 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()) автоматически обрезает все излишки 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 + '"';

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

Характеристики

Характеристики Статус Комментарий
DOM
Определение 'DOMTokenList' в этой спецификации.
Живой стандарт Начальное определение

Совместимость браузера

BCD tables only load in the browser

Смотрите также:

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