是否可以在同一个HTML5 <video>元素中预加载多个视频资源？

Question

我正在开发一个web应用程序的细节，它涉及到一个长系列(非常短)视频剪辑的顺序加载，一个接一个地，用户偶尔输入建立加载视频剪辑的新方向。

我希望能够有浏览器预加载视频剪辑一次五个。然而，我们目前让站点工作的方式是通过JavaScript不断更新其src属性的单个视频元素。

有没有一种简单的方法可以让浏览器预加载多个视频剪辑，即使我最终将它们全部(一次一个)加载到同一个视频元素中？

Answer 1

通过在JavaScript中创建<img>标签并设置其src属性，可以在浏览器中预加载图像。尽管任何规范都不要求这样做，但所有浏览器都会下载图像并缓存(假设它们的缓存没有被禁用)。

我不知道这是否适用于HTML5中的<video>元素，但也许可以。你能试一试吗？

Answer 2

我很好奇你是不是碰巧完成了你正在做的项目？我正在试验一个带有播放列表的html5视频播放器，我想知道你是否遇到了什么大问题。加载/播放多个视频文件是否存在性能问题？你能在iPad上运行吗？你有IE的后备方案吗？

我的方法是:使用具有多个隐藏<video>元素的单个<canvas>元素，并使用canvas drawImage()函数在视频之间显示和交叉淡入淡出。