HTML <video> id Attribute

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">

Using id

The id attribute assigns an identifier to the <video> element.

The identifier must be unique across the page.

id allows programmatic access to the <video> element.

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 (.).

More Examples

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">

<button onclick="play();">Play</button>
<button onclick="pause();">Pause</button>


  let video = document.getElementById("myvideo");

  let play = () =>;
  let pause = () => video.pause(); 


Code explanation

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.

Browser support

Here is when id support started for each browser:

4.0 Jan 2010
3.5 Jun 2009
9.0 Sep 2012
10.5 Mar 2010
4.0 Jun 2009

You may also like

 Back to <video>

Last updated on Sep 30, 2023