javascript - 如何在html视频标签中使用youtube视频

Question

我的网站有 YouTube 视频，我想在 HTML5 的视频标签中显示这些视频。是否可以将 youtube 的 iframe 标签嵌入到 video 标签中？

<div class="col-md-6">
   <video class="video_link" width="320" height="240" controls="controls" id="3"> 
      <source src="" type="video/mp4" />
   </video>
</div>

Answer 1

如果浏览器无法识别 HTML5 视频标记，则可以上传 Flash swf 文件并在嵌入标记的 src 属性中指向该文件，该标记嵌入在视频标记本身中。

<video width="{#}" height="{#}" controls>
  <source src="{ogg_file}.ogg" type="video/ogg" />  
  <source src="{mp4_file}.mp4" type="video/mp4" />  

  <!-- The fallback in case the browser doesn't recognize the HTML5 video tag -->  
  <embed src="{flash_swf_file}.swf" type="application/x-shockwave-flash" width="{#}" height="{#}"></embed>  
</video>

iframe 标记在现有页面中加载页面。也许他们希望将视频放在 iframe 标记指定的单独页面上。每当您使用 iframe 时，请考虑在 CSS 文件中使用此代码，否则某些浏览器将显示 iframe 所在位置的框线。

iframe[seamless] {
    background-color: transparent;
    border: 0px none transparent;
    padding: 0px;
    overflow: hidden;
}

要使 CSS 代码正常工作，必须在起始 iframe 标记的末尾包含 Seamless。

<div><iframe src="{page_name}.html" height="{#}" width="{#}" seamless></iframe></div>