我尝试了几种方法：
我尝试创建隐藏的视频标签并显示/隐藏它们，但这会导致闪烁。
我尝试更改视频的src属性，但我必须在play（）之前调用load（）方法，而load（）将加载新视频。
这也不是我想要的，因为这会导致新视频暂停一段时间（因为需要加载时间）。
我尝试使用ajax缓存新视频，以便在上一个视频完成之前在后台加载新视频。在旧视频播放完毕之前，可以完全下载新视频（300K字节）。
但是当我在新视频上调用.load（）函数时，它会再次下载。
我的问题是：对于我的第三种方法，视频对象是否有办法在缓存中使用下载的文件？
在阅读之后，我认为以上三种可能是实现我的目标的唯一方法。第三个是我想要的，但视频文件刚下载两次（一次是Ajax下载，另一次是调用load（））。请注意，如果不调用load（），只需更改src属性并调用play（）就不起作用。
答案 0 :(得分：4)
Media Source Extensions就是您所需要的。很难找到关于它们的好文档（在撰写本文时，MDN's documentation主要是存根），但如果你敢，你可以深入研究the spec。
两句话摘要是，使用Media Source Extensions，您可以创建MediaSource对象并将其设置为<video>元素的来源，而不是将<video>指向完整视频的网址。然后，您可以使用JavaScript明确下载代表直播视频流的更多片段的视频，并将其附加到您的MediaSource对象，这些片段将无缝播放。
此外，虽然它稍微超出了您在此处所要求的范围，MPEG-DASH是一种让完全符合您对感兴趣的技巧>（即通过将短段编码为单个文件来流式传输实时视频，例如短独立mp4，并将这些段单独提供给浏览器）。在没有Media Source Extensions的情况下，没有办法在没有Media Source Extensions的浏览器中实现MPEG-DASH，因此它们经常被一起讨论。使用the BBC's tech blog和MSDN上的媒体源扩展，使用HTML和JavaScript构建DASH播放器有一些很好的写作（在不同的详细程度）。
不幸的是，Media Source Extensions尚未在所有主流浏览器中提供。例如，我Mac上的最新版本的Firefox没有window.MediaSource。这意味着您无法仅使用HTML 5 <video>元素 在所有主要浏览器上运行分段实时流式传输。不幸的是，如果您需要跨浏览器兼容性，仍然需要回退到Flash。
与您一样，我尝试在不使用Media Source Extensions的情况下实现此行为。我尝试（并尝试组合）一系列技术，包括在<video>元素上交换网址，取消隐藏和播放<video>元素，提前完整下载细分并将其存储在Blobs中我将[{1}}用作我的src元素，并将preload属性设置为<video>以将片段加载到内存中...但没有工作。在Google Chrome浏览器中，使用任何这些技术会导致auto来自第一个视频的play()事件的第二个视频出现明显的断断续续的情况，即使您有＆＃ 39;提前完全加载了第二个视频。没有一种方法可以使用ended元素进行无缝连续视频播放，而不会在不支持Media Source Extensions的浏览器中出现某种口吃。