The HTML buffered attribute
Quick answer
The buffered property is a read-only JavaScript property (not an HTML attribute) returning a TimeRanges object describing which parts of the media have been downloaded, useful for drawing a buffering bar.
Overview
The buffered attribute gives the time ranges of media that the browser has buffered. It applies to the <audio> and <video> elements (as a JavaScript property).
Read it in JavaScript, typically inside a progress handler, to visualize how much has loaded.
Syntax
if (video.buffered.length) {
var end = video.buffered.end(0);
}Values
| Value |
|---|
| A read-only TimeRanges object. |
Best practices
- Access it in JavaScript on the element object; there is no corresponding HTML attribute to write.
- Read it to inspect state; some are read-only and cannot be set.
- Do not try to set it as a markup attribute; it will be ignored.
- Combine it with the relevant events to react to changes.
Frequently asked questions
What does the buffered attribute do?
Reports buffered media ranges (a JS property).
Can I set this as an HTML attribute?
No. It is a read-only JavaScript property, not a markup attribute. Read it from the element in script.
How do I access it?
Through the element object in JavaScript, e.g.
video.buffered.Which elements use the buffered attribute?
It is exposed on the
<audio> and <video> elements, but as a read-only JavaScript property (media.buffered), not a markup attribute.