HTML5视频：停滞事件

Question

我正在使用Google Chrome上的HTML5视频标签编写视频播放器：我需要显示一些视频（1），然后将它们从DOM文档中删除以显示其他视频，然后再创建一些指向与（ 1）。

我注意到有时有时视频在第二次加载时没有显示，而是触发了“停滞”事件……我应该怎么做才能处理此事件并能够显示视频？如果我保留对第一个视频标签的引用，然后在以后重用它，则可以使用，但是保留对每个视频标签的引用可能会非常消耗内存！

Answer 1

如果浏览器一次要加载两个或三个以上的视频，则其中一些将停顿。尽管HTML5视频提供了一种告诉它开始加载视频的方法，但是却无法告诉它停止。第一次开始播放时，只要它在内存中，它将继续尝试加载更多数据，以防万一您决定再次开始播放它。而且一次只能加载这么多视频，因此，如果您仍在加载前三个视频，那么第四个视频将等待非常长的时间。

删除旧视频并在以后再次加载是正确的方法，但是您需要非常彻底地使浏览器停止尝试加载它们。这是您需要做的。

// 1) Pause the video
oldVideo.pause();

// 2) Clear the video source URL
oldVideo.src = "";

// 3) Tell the video to start loading "nothing"
oldVideo.load();

最后一步至关重要。即使您将其设置src为空字符串，视频也会忽略它，直到您致电为止load。如果需要，也可以将其从DOM和任何数据结构中删除，以便可以完全对其进行垃圾回收。但是即使这样做，也不会清除垃圾，除非您清除src和调用load。

下次加载视频时，通过创建新元素或将其设置src为相同元素，它应该可以正常工作。