HTMLElement: containerTiming property
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Want more browser support for this feature? Tell us why.
The containerTiming property of the HTMLElement interface marks the element as a container root for observation in the Container Timing API.
The containerTiming property reflects the value of the containertiming attribute.
Setting the property adds the attribute, making the element a container root: if the element is already in the document, only subsequent paints contribute to its timing.
Value
A string.
This is the empty string ("") if the attribute isn't set.
Examples
Logging the value of containerTiming
In this example, adding the containertiming attribute to the <section> element sets it up as a container root.
<section containertiming="hero" id="hero-section">
<!-- ... -->
</section>
We can then read the property and log its value:
const el = document.getElementById("hero-section");
console.log(el.containerTiming); // "hero"
For examples of how to use the Container Timing API to get timing information, see PerformanceContainerTiming.
Specifications
| Specification |
|---|
| Container Timing API # dom-htmlelement-containertiming |