An id on a <video> tag assigns an identifier to the video player.
The identifier must be unique across the page.
An id attribute on a <video> element.
<video id="bunny-clip" width="320" height="240" controls>
<source src="/media/movie.mp4" type="video/mp4">
<source src="/media/movie.ogg" type="video/ogg">
</video>
The id attribute assigns an identifier to the <video> element.
The identifier must be unique across the page.
Tip: id is a global attribute that can be applied to any HTML element.
<video id="identifier" >
| Value | Description |
|---|---|
| identifier | A unique alphanumeric string. The id value must begin with a letter ([video-Zvideo-z]) and may be followed by any number of letters, digits ([0-9]), hyphens (-), underscores (_), colons (:), and periods (.). |
A <video> element with a unique id.
The Play and Pause buttons start and stop playing the video file.
<video id="myvideo" width="320" height="240">
<source src="/media/movie.mp4" type="video/mp4">
<source src="/media/movie.ogg" type="video/ogg">
</video>
<br/><br/>
<button onclick="play();">Play</button>
<button onclick="pause();">Pause</button>
<script>
let video = document.getElementById("myvideo");
let play = () => video.play();
let pause = () => video.pause();
</script>
The id attribute assigns a unique identifier to the <video> element.
On page load, JavaScript locates the <video> control using the id.
The Play and Pause buttons use the <video> reference to play and pause the video control.
Here is when id support started for each browser:
 Chrome
|
4.0 | Jan 2010 |
 Firefox
|
3.5 | Jun 2009 |
 IE/Edge
|
9.0 | Sep 2012 |
 Opera
|
10.5 | Mar 2010 |
 Safari
|
4.0 | Jun 2009 |
Back to <video>
