就浏览器兼容性而言,ifram或<video>哪个更适合播放视频(YouTube和非YouTube)

Which is better ifram or <video> to play video (both youtube as well non youtube) in terms of browser compatibility?

本文关键字:YouTube 播放 和非 视频 video 兼容性 浏览器 ifram      更新时间:2023-09-26

>我尝试了两者

  1. iframe - 没有停止自动播放或控制非YouTube视频视频的解决方案
  2. 视频 - 不支持优酷视频

使用 iframe

 <iframe id="vt" width="420" autoplay="false" height="345" src="http://cache4.asset-cache.net/xd/468140002.mp4?v=1&c=IWSAsset&k=2&d=72990B68305E4FDFEE95B69A879131BCD6D7111452E48A17C03F8342D660D5A451EBC1DEC2A827C9&b=RTdG" frameborder="0" allowfullscreen></iframe>
jQuery(document).ready(function () {
   // var url = $('#vt').attr('src');
 // $('#vt').attr('src', '');
 //   $('#vt').attr('src', url);
    var vid = document.getElementById("vt");
    vid.pause()
//vid.onpause = function() {
    //alert("The video has been paused");
};
});

带视频标签

<video width="320"  height="240" src="https://www.youtube.com/watch?v=dwH34mR6ZG8" controls="controls"> </video>

首先,iframe从来都不是为了显示嵌入式媒体。这是对象标签打算处理的内容。来自 MDN 文档:

HTML 内联框架元素 ( <iframe> ( 表示嵌套浏览 上下文,有效地将另一个 HTML 页面嵌入到当前 页。

HTML 嵌入式对象元素 (<object>( 表示外部 资源,可以被视为图像、嵌套浏览上下文, 或由插件处理的资源。

两者都早于 video 元素,这是您应该始终用于在网页中嵌入视频内容的内容。

其次,YouTube视频并不意味着直接从<video>元素链接......他们为您提供的嵌入代码是一个iframe,无论如何都可以打开HTML5视频播放器(或古董设备的Flash回退(。

结论:如果您尝试展示的视频未在 YouTube 上托管或无法托管,请使用网页上的 video 标记进行嵌入,并确保将视频转换为尽可能多的支持格式。网上有很多关于HTML5视频的文章,所以我不会在这里详细介绍这个过程。