HTML5 特性检测：Video Format(视频格式)

不是所有的浏览器都遵循一种视频编码算法，它们主要遵循两种编码算法，一种是Safari和iphone遵循的需要收费的，另外一种是Chromium和Mozilla Firefox支持的开源免费的。

 

如果你的浏览器支持HTML5的Video特性，那么你用来检测的时候创建 的<video>元素会有一个叫canPlayType()的方法，这个方法可以告诉你你的浏览器支持哪种视频格式

 

如果你不想自己亲手去写这个检测方法的话，你可以使用Modernizr来检测你的浏览器支持哪种HTML5的视频格式。

  if(Modernizr.video)
{//let's play some video! but what kind?if(Modernizr.video.ogg)
    {//try Ogg Theora+Vorbis in an Ogg container}
else if
(Modernizr.video.h264)
{//try H.264 video + AAC audio in an MP4 container
    }
  }

        用 来检测Macs和iphones支持的视频格式的方法是:function supports_h264_baseline_video(){if(!supports_video()){ return false; }var v = document.createElement("video");return v.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"');}
        这个方法从使用之前介绍过 的”supports_video()”方法来浏览器是否支持Video特性开始。如果你的浏览器不支持HTML5 的video特性，那么它自然也肯定不支持什么所谓的视频格式了。if(!supports_video()){ return false; }
        “视 频格式”：简简单单一句话，其实包含了很多的东西。从技术的形式来讲，你可以问：“浏览器是否可以播放基于“H.264”的视频和在MPEG-4容器上的 AAC LC音频（我会在后面详细介绍视频的章节告诉你这是什么意思）。如果你想了解更多，你可以阅读视频编码概述这篇文章    return v.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"');
        canPlayType()方法不会返回boolean值（True或者False）。因为视频格式非常的复杂，所以这个方法的返回值有以下几种值：

1. “probably“如果你的浏览器确认可以支持你传入的视频格式
2. “maybe”如果你的浏览器或许可以支持你传入的视频格式
3. “”（空的字符串）如果你的浏览器确认不能支持你传入的视频格式

        第 二种检测Mozilla Firefox和其他一些开源浏览器支持的开源视频编码格式的方式其实和第一种类似，唯一的不同点是你传入的参数不同，从技术的角度来讲，你可以问你的浏 览器是否支持在Ogg容器内的“Theora“视频格式和”Vorbis”音频格式。function supports_ogg_theora_video(){if(!supports_video()){ return false; }var v = document.createElement('video');return v.canPlayType('video/ogg; codecs="theora,vorbis"');}

转载于:https://www.cnblogs.com/ctriphire/archive/2013/02/22/2922207.html