Javascript DOM HTML Video Object create

Introduction

We can create a <video> element via the document.createElement() method:

var x = document.createElement("VIDEO");

Click the button to create a VIDEO element with controls that will play a movie in a .mp3 or .ogg file format.

View in separate window

<!DOCTYPE html>
<html>
<body>
<button onclick="myFunction()">Test</button>

<script>
function myFunction() {/* w ww.j ava 2  s  .c  om*/
  var x = document.createElement("VIDEO");

  if (x.canPlayType("video/mp4")) {
    x.setAttribute("src","video.mp4");
  } else {
    x.setAttribute("src","video.ogg");
  }

  x.setAttribute("width", "100");
  x.setAttribute("height", "100");
  x.setAttribute("controls", "controls");
  document.body.appendChild(x);
}
</script>

</body>
</html>



PreviousNext

Related