如何检查html5视频支持？

Question

是否有任何 JavaScript 或任何其他方式来检查 html5 视频支持？

Answer 1

使用：

<script>
alert(!!document.createElement('video').canPlayType);
</script>

如果它警报 true 意味着您的浏览器支持 HTML5 视频标签

这是检查 HTML5 浏览器兼容性的 url http://www .html5test.com/
在浏览器中打开该url，测试一下浏览器对html5的支持程度

Answer 2

只是对糖果的一点改进 - BlingBling 的回答：抱歉 - 我还不能发表评论 :(

var isHTML5Video = (typeof(document.createElement('video').canPlayType) != 'undefined') ? true : false;

甚至更简单（感谢 digitalBath - 一如既往，我看不到树木的木材 :) ）

var isHTML5Video = (typeof(document.createElement('video').canPlayType) != 'undefined');

Answer 3

看看 Modernizer：http://www.modernizr.com/

在那里，您可以轻松获得 API但

if (Modernizr.video) {
  // html5 video available
}

还有更多的功能和更合适的 API。

Answer 4

我使用 @sweets-BlingBling 的答案的一个细微变化，即：

var hasVideo = !!document.createElement('video').canPlayType &&
               !!document.createElement('video').canPlayType('video/mp4')

这还会检查媒体类型 'vid​​eo/mp4' 是否实际上可以播放（如果您的视频有其他媒体类型，请更改此设置，例如 <代码>'vid​​eo/webm'或'vid​​eo/ogg'）。如果视频确实无法播放并且'可能' 或'maybe'（实际上，这两个结果均表示yes），则该方法返回一个空字符串大多数情况下）否则。我必须为 Chrome 41 添加此功能（似乎在谷歌爬虫中使用），它具有 canPlayType，但无法播放 mp4 视频。

Answer 5

一种方法是嵌入 html5 标签，然后将备用视频查看器作为“后备”放入视频标签内。如果浏览器无法识别该标签，则会显示后备。它并不严格“检测”html5 视频支持，但可能适合您的需求。

<video src='...'>
    <embed flash player instead>
</video>