StyleSheetList
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Giao diện StyleSheetList đại diện cho danh sách các đối tượng CSSStyleSheet. Một instance của đối tượng này có thể được trả về bởi Document.styleSheets.
Đây là đối tượng dạng mảng nhưng không thể được lặp lại bằng các phương thức Array. Tuy nhiên, nó có thể được lặp lại trong vòng lặp for tiêu chuẩn qua các chỉ mục của nó, hoặc được chuyển đổi thành Array.
Note:
Thông thường các giao diện danh sách như StyleSheetList bọc xung quanh các kiểu Array, vì vậy bạn có thể sử dụng các phương thức Array trên chúng.
Đây không phải là trường hợp ở đây vì lý do lịch sử. Tuy nhiên, bạn có thể chuyển đổi StyleSheetList thành Array để sử dụng những phương thức đó (xem ví dụ dưới đây).
Thuộc tính phiên bản
StyleSheetList.lengthRead only-
Trả về số lượng đối tượng
CSSStyleSheettrong bộ sưu tập.
Phương thức phiên bản
StyleSheetList.item()-
Trả về đối tượng
CSSStyleSheettại chỉ mục được truyền vào, hoặcnullnếu không có item nào tồn tại cho chỉ mục đó.
Ví dụ
Lấy đối tượng CSSStyleSheet với vòng lặp for
for (const styleSheet of document.styleSheets) {
console.log(styleSheet); // Một đối tượng CSSStyleSheet
}
Lấy tất cả quy tắc CSS cho tài liệu bằng phương thức Array
const allCSS = [...document.styleSheets]
.map((styleSheet) => {
try {
return [...styleSheet.cssRules].map((rule) => rule.cssText).join("");
} catch (e) {
console.log(
"Truy cập stylesheet %s bị từ chối. Bỏ qua…",
styleSheet.href,
);
return undefined;
}
})
.filter(Boolean)
.join("\n");
Thông số kỹ thuật
| Specification |
|---|
| CSS Object Model (CSSOM) # the-stylesheetlist-interface |