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' в этой спецификации.
Живой стандарт Начальное определение

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

Update compatibility data on GitHub
КомпьютерыМобильные
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome для AndroidFirefox для AndroidOpera для AndroidSafari on iOSSamsung Internet
DOMTokenListChrome Полная поддержка 8Edge Полная поддержка 12Firefox Полная поддержка 3IE Полная поддержка 10Opera Полная поддержка 11.5Safari Полная поддержка 5.1WebView Android Полная поддержка 3Chrome Android Полная поддержка 18Firefox Android Полная поддержка 4Opera Android Полная поддержка 11.5Safari iOS Полная поддержка 5.1Samsung Internet Android Полная поддержка 1.0
addChrome Полная поддержка 8Edge Полная поддержка 12Firefox Полная поддержка ДаIE Полная поддержка 10Opera Полная поддержка ДаSafari Полная поддержка 5.1WebView Android Полная поддержка 3Chrome Android Полная поддержка 18Firefox Android Полная поддержка ДаOpera Android Полная поддержка ДаSafari iOS Полная поддержка 5.1Samsung Internet Android Полная поддержка 1.0
containsChrome Полная поддержка 8Edge Полная поддержка 12Firefox Полная поддержка ДаIE Полная поддержка 10Opera Полная поддержка ДаSafari Полная поддержка 5.1WebView Android Полная поддержка 3Chrome Android Полная поддержка 18Firefox Android Полная поддержка ДаOpera Android Полная поддержка ДаSafari iOS Полная поддержка 5.1Samsung Internet Android Полная поддержка 1.0
entriesChrome Полная поддержка 42Edge Полная поддержка 16Firefox Полная поддержка 50IE Нет поддержки НетOpera Полная поддержка 32Safari Полная поддержка 10.1WebView Android Полная поддержка 45Chrome Android Полная поддержка 45Firefox Android Полная поддержка 50Opera Android Полная поддержка 32Safari iOS Полная поддержка 10.3Samsung Internet Android Полная поддержка 5.0
forEachChrome Полная поддержка 42Edge Полная поддержка 16Firefox Полная поддержка 50IE Нет поддержки НетOpera Полная поддержка 32Safari Полная поддержка 10.1WebView Android Полная поддержка 45Chrome Android Полная поддержка 45Firefox Android Полная поддержка 50Opera Android Полная поддержка 32Safari iOS Полная поддержка 10.3Samsung Internet Android Полная поддержка 5.0
itemChrome Полная поддержка 8Edge Полная поддержка 12Firefox Полная поддержка ДаIE Полная поддержка 10Opera Полная поддержка ДаSafari Полная поддержка 5.1WebView Android Полная поддержка 3Chrome Android Полная поддержка 18Firefox Android Полная поддержка ДаOpera Android Полная поддержка ДаSafari iOS Полная поддержка 5.1Samsung Internet Android Полная поддержка 1.0
keysChrome Полная поддержка 42Edge Полная поддержка 16Firefox Полная поддержка 50IE Нет поддержки НетOpera Полная поддержка 32Safari Полная поддержка 10.1WebView Android Полная поддержка 45Chrome Android Полная поддержка 45Firefox Android Полная поддержка 50Opera Android Полная поддержка 32Safari iOS Полная поддержка 10.3Samsung Internet Android Полная поддержка 5.0
lengthChrome Полная поддержка 8Edge Полная поддержка 12Firefox Полная поддержка 50IE Полная поддержка 10Opera Полная поддержка ДаSafari Полная поддержка 5.1WebView Android Полная поддержка 3Chrome Android Полная поддержка 18Firefox Android Полная поддержка 50Opera Android Полная поддержка ДаSafari iOS Полная поддержка 5.1Samsung Internet Android Полная поддержка 1.0
removeChrome Полная поддержка 8Edge Полная поддержка 12Firefox Полная поддержка ДаIE Полная поддержка 10Opera Полная поддержка ДаSafari Полная поддержка 5.1WebView Android Полная поддержка 3Chrome Android Полная поддержка 18Firefox Android Полная поддержка ДаOpera Android Полная поддержка ДаSafari iOS Полная поддержка 5.1Samsung Internet Android Полная поддержка 1.0
Removes duplicatesChrome Полная поддержка 60Edge Полная поддержка 17Firefox Полная поддержка 55IE Нет поддержки НетOpera Полная поддержка 47Safari Полная поддержка 10WebView Android Полная поддержка 60Chrome Android Полная поддержка 60Firefox Android Полная поддержка 55Opera Android Полная поддержка 44Safari iOS Полная поддержка 10Samsung Internet Android Полная поддержка 8.0
replaceChrome Полная поддержка 61Edge Полная поддержка 17Firefox Полная поддержка 49IE Нет поддержки НетOpera Полная поддержка 48Safari Полная поддержка 10.1WebView Android Полная поддержка 61Chrome Android Полная поддержка 61Firefox Android Полная поддержка 49Opera Android Полная поддержка 45Safari iOS Полная поддержка 10.3Samsung Internet Android Полная поддержка 8.0
supports
Экспериментальная
Chrome Полная поддержка 49Edge Полная поддержка 17Firefox Полная поддержка 49IE Нет поддержки НетOpera Полная поддержка 36Safari Полная поддержка 10.1WebView Android Полная поддержка 49Chrome Android Полная поддержка 49Firefox Android Полная поддержка 49Opera Android Полная поддержка 36Safari iOS Полная поддержка 10.3Samsung Internet Android Полная поддержка 5.0
toggleChrome Полная поддержка 8Edge Полная поддержка 12Firefox Полная поддержка ДаIE Полная поддержка 10Opera Полная поддержка ДаSafari Полная поддержка 5.1WebView Android Полная поддержка 3Chrome Android Полная поддержка 18Firefox Android Полная поддержка ДаOpera Android Полная поддержка ДаSafari iOS Полная поддержка 5.1Samsung Internet Android Полная поддержка 1.0
Trims whitespaceChrome Полная поддержка 48Edge Полная поддержка 12Firefox Полная поддержка 51IE Полная поддержка 10Opera Полная поддержка 35Safari Полная поддержка 10WebView Android Полная поддержка 48Chrome Android Полная поддержка 48Firefox Android Полная поддержка 51Opera Android Полная поддержка 35Safari iOS Полная поддержка 10Samsung Internet Android Полная поддержка 5.0
valueChrome Полная поддержка 50
Замечания
Полная поддержка 50
Замечания
Замечания Before Chrome 50, this property was part of the deprecated child DOMSettableTokenList interface.
Edge Полная поддержка 17Firefox Полная поддержка 47IE Нет поддержки НетOpera Полная поддержка 37
Замечания
Полная поддержка 37
Замечания
Замечания Before Opera 37, this property was part of the deprecated child DOMSettableTokenList interface.
Safari Полная поддержка 10WebView Android Полная поддержка 50
Замечания
Полная поддержка 50
Замечания
Замечания Before Chrome 50, this property was part of the deprecated child DOMSettableTokenList interface.
Chrome Android Полная поддержка 50
Замечания
Полная поддержка 50
Замечания
Замечания Before Chrome 50, this property was part of the deprecated child DOMSettableTokenList interface.
Firefox Android Полная поддержка 47Opera Android Полная поддержка 37
Замечания
Полная поддержка 37
Замечания
Замечания Before Opera 37, this property was part of the deprecated child DOMSettableTokenList interface.
Safari iOS Полная поддержка 10Samsung Internet Android Полная поддержка 5.0
Замечания
Полная поддержка 5.0
Замечания
Замечания Before Samsung Internet 5.0, this property was part of the deprecated child DOMSettableTokenList interface.
valuesChrome Полная поддержка 42Edge Полная поддержка 16Firefox Полная поддержка 50IE Нет поддержки НетOpera Полная поддержка 32Safari Полная поддержка 10.1WebView Android Полная поддержка 45Chrome Android Полная поддержка 45Firefox Android Полная поддержка 50Opera Android Полная поддержка 32Safari iOS Полная поддержка 10.3Samsung Internet Android Полная поддержка 5.0

Легенда

Полная поддержка  
Полная поддержка
Нет поддержки  
Нет поддержки
Экспериментальная. Ожидаемое поведение может измениться в будущем.
Экспериментальная. Ожидаемое поведение может измениться в будущем.
Смотрите замечания реализации.
Смотрите замечания реализации.

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

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