DOMTokenList

Thuộc tính thể hiện

DOMTokenList.length Read only

Một integer biểu thị số lượng đối tượng được lưu trong đối tượng.

DOMTokenList.value

Thuộc tính stringifier trả về giá trị của danh sách dưới dạng chuỗi.

Phương thức thể hiện

DOMTokenList.item()

Trả về mục trong danh sách theo chỉ số của nó, hoặc null nếu chỉ số lớn hơn hoặc bằng length của danh sách.

DOMTokenList.contains()

Trả về true nếu danh sách chứa token đã cho, ngược lại trả về false.

DOMTokenList.add()

Thêm các token được chỉ định vào danh sách.

DOMTokenList.remove()

Xóa các token được chỉ định khỏi danh sách.

DOMTokenList.replace()

Thay thế một token bằng token khác.

DOMTokenList.supports()

Trả về true nếu token đã cho nằm trong danh sách token được hỗ trợ của thuộc tính liên quan.

DOMTokenList.toggle()

Xóa token khỏi danh sách nếu nó tồn tại, hoặc thêm nó vào danh sách nếu không tồn tại. Trả về giá trị boolean cho biết token có nằm trong danh sách sau thao tác hay không.

DOMTokenList.entries()

Trả về một iterator, cho phép bạn duyệt qua toàn bộ các cặp khóa/giá trị có trong đối tượng này.

DOMTokenList.forEach()

Thực thi một hàm callback được cung cấp một lần cho mỗi phần tử của DOMTokenList.

DOMTokenList.keys()

Trả về một iterator, cho phép bạn duyệt qua toàn bộ các khóa của các cặp khóa/giá trị có trong đối tượng này.

DOMTokenList.toString()

Trả về DOMTokenList.value, tức các giá trị của danh sách được nối thành một chuỗi bằng dấu cách.

DOMTokenList.values()

Trả về một iterator, cho phép bạn duyệt qua toàn bộ các giá trị của các cặp khóa/giá trị có trong đối tượng này.

Ví dụ

Trong ví dụ đơn giản sau, chúng ta lấy danh sách các lớp được đặt trên một phần tử <p> dưới dạng DOMTokenList bằng Element.classList, thêm một lớp bằng DOMTokenList.add(), rồi cập nhật Node.textContent của thẻ <p> sao cho bằng DOMTokenList.

Trước hết là HTML:

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

Bây giờ là JavaScript:

let para = document.querySelector("p");
let classes = para.classList;
para.classList.add("d");
para.textContent = `paragraph classList is "${classes}"`;

Kết quả sẽ như sau:

Cắt khoảng trắng và loại bỏ giá trị trùng lặp

Các phương thức sửa đổi DOMTokenList (chẳng hạn như DOMTokenList.add()) sẽ tự động cắt bỏ mọi Whitespace dư thừa và loại bỏ các giá trị trùng lặp khỏi danh sách. Ví dụ:

<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}"`;

Kết quả sẽ như sau:

Thông số kỹ thuật

Tương thích trình duyệt