元素:part 属性
part
是 Element
接口的一个属性,表示元素的部件标识符(即使用 part
属性设置),以 DOMTokenList
的形式返回。可以通过 ::part
伪元素,使用这些标识符来为 Shadow DOM 的部件设置样式。
值
一个 DOMTokenList
对象。
示例
以下摘录来自我们的 shadow-part 示例。这里,part
属性用于查找 shadow 部分,然后 part
属性用于更改每个选项卡的部分标识符,以便在单击选项卡时将正确的样式应用于活动选项卡。
js
const tabs = [];
const children = this.shadowRoot.children;
for (const elem of children) {
if (elem.getAttribute("part")) {
tabs.push(elem);
}
}
tabs.forEach((tab) => {
tab.addEventListener("click", (e) => {
tabs.forEach((tab) => {
tab.part = "tab";
});
e.target.part = "tab active";
});
console.log(tab.part);
});
规范
规范 |
---|
CSS Shadow 部分 # idl |
浏览器兼容性
BCD 表格仅在浏览器中加载