DOMTokenList
DOMTokenList 接口表示一组由空格分隔的标记（token）。例如，Element.classList 或 HTMLLinkElement.relList 以及许多其他属性会返回这样的集合。
DOMTokenList 与 JavaScript 的 Array 对象一样，从 0 开始索引。DOMTokenList 始终区分大小写。
实例属性
DOMTokenList.length只读-
一个
integer，表示对象中存储的对象数量。 DOMTokenList.value-
一个 字符串转换器（stringifier） 属性，以字符串形式返回列表的值。
实例方法
DOMTokenList.item()-
根据索引返回列表中的项，如果索引大于或等于列表的
length，则返回null。 DOMTokenList.contains()-
如果列表包含给定标记，则返回
true，否则返回false。 DOMTokenList.add()-
将指定的标记添加到列表中。
DOMTokenList.remove()-
从列表中移除指定的标记。
DOMTokenList.replace()-
用另一个标记替换现有标记。
DOMTokenList.supports()-
如果给定标记存在于关联属性支持的标记列表中，则返回
true。 DOMTokenList.toggle()-
如果令牌存在于列表中，则将其移除；如果不存在，则将其添加到列表中。返回一个布尔值，指示操作后令牌是否在列表中。
DOMTokenList.entries()-
返回一个 迭代器（iterator），允许您遍历对象中包含的所有键/值对。
DOMTokenList.forEach()-
为
DOMTokenList中的每个元素执行一次提供的回调函数。 DOMTokenList.keys()-
返回一个 迭代器（iterator），允许您遍历对象中包含的所有键/值对的键。
DOMTokenList.toString()-
返回
DOMTokenList.value，即列表中由空格分隔的值组成的字符串。 DOMTokenList.values()-
返回一个 迭代器（iterator），允许您遍历对象中包含的所有键/值对的值。
示例
在下面的简单示例中，我们使用 Element.classList 获取 <p> 元素上设置的类列表（作为 DOMTokenList），然后使用 DOMTokenList.add() 添加一个类，最后将 <p> 的 Node.textContent 更新为等于 DOMTokenList 的值。
首先，HTML 代码
<p class="a b c"></p>
现在是 JavaScript 代码
let para = document.querySelector("p");
let classes = para.classList;
para.classList.add("d");
para.textContent = `paragraph classList is "${classes}"`;
输出如下所示
修剪空格并移除重复项
修改 DOMTokenList 的方法（例如 DOMTokenList.add()）会自动修剪任何多余的 空格 并从列表中移除重复的值。例如：
<span class=" d d e f"></span>
let span = document.querySelector("span");
let classes = span.classList;
span.classList.add("x");
span.textContent = `span classList is "${classes}"`;
输出如下所示
规范
| 规范 |
|---|
| DOM # interface-domtokenlist |
浏览器兼容性
加载中…