Search code examples
htmlxhtml

Insert video using <object> element


I'm new to HTML and need to insert a video from youtube onto my page using an element. I've tried different ways but just cannot get it to work. This is the link: https://www.youtube.com/watch?v=ZSM3w1v-A_Y

<!DOCTYPE HTML>
<HTML> 
<head> <title> video </title> </head>
<body>
  <object> </object>

</body> </html> 

Solution

  • You should not use <object> to display a video. Using <object> for videos is an outdated approach. Use <video> instead

     <video controls>
      <source src="video.mp4" type="video/mp4">
    </video> 
    

    if you really want to use <object>

     <object data="video.mp4"></object> 
    

    Of course, all of this assumes you have the video downloaded. If you want to display the youtube video directly from the youtube link like your example, you will have to just embed the youtube player in your webpage with an iframe. You cannot access the raw video directly from youtube.

    <iframe src="https://www.youtube.com/watch?v=ZSM3w1v-A_Y">
    

    EDIT: For clarification, you can link to a video from another source, but YouTube does not expose the raw video itself so this is not applicable to YouTube. Also, you can technically put the YouTube link directly in an <object> as you described, but this will cause a CORS violation and therefore will not load. This also still essentially just embeds the youtube player