Baseline Widely available
The part
property of the Element
interface represents the part identifier(s) of the element (i.e., set using the part
attribute), returned as a DOMTokenList
. These can be used to style parts of a shadow DOM, via the ::part
pseudo-element.
A DOMTokenList
object.
The following excerpt is from our shadow-part example. Here the part
attribute is used to find the shadow parts, and the part
property is then used to change the part identifiers of each tab so the correct styling is applied to the active tab when tabs are clicked.
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);
});
Specifications Browser compatibility See also
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4