·您当前的位置:主页 > 技术教程 > JavaScript >

[html5]用js判断用户终端浏览器是不是支持video视频标签的源代码

时间:2017-09-19 17:07酷播
[html5]用js判断浏览是不是支持video视频标签的源代码范例

[html5]用js判断用户终端浏览器是不是支持video视频标签的源代码范例

  1. //检测是否支持HTML5 
  2. function checkVideo() { 
  3.     if (!!document.createElement('video').canPlayType) { 
  4.         var vidTest = document.createElement("video"); 
  5.         oggTest = vidTest.canPlayType('video/ogg; codecs="theora, vorbis"'); 
  6.         if (!oggTest) { 
  7.             h264Test = vidTest.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"'); 
  8.             if (!h264Test) { 
  9.                 return false; 
  10.             } 
  11.             else { 
  12.                 if (h264Test == "probably") { 
  13.                     return true; 
  14.                 } 
  15.                 else { 
  16.                     return false; 
  17.                 } 
  18.             } 
  19.         } 
  20.         else { 
  21.             if (oggTest == "probably") { 
  22.                 return true; 
  23.             } 
  24.             else { 
  25.                return false; 
  26.             } 
  27.         } 
  28.     } 
  29.     else { 
  30.         return false; 
  31.     } 

用上述的办法可以判断当前浏览器是否支持HTML5中的Video标签,并能支持使用MP4格式进行播放(因为Firefox貌似因为版权原因,不支持以H.264编码的MP4格式播放),如果返回true,则可以使用HTML5中的Video进行播放视频,返回false,则用Flash插件进行播放。此方法一般用于视频网站,兼容手机,平板等设备进行视屏的播放,主要还是为了兼容IOS。

微信付费直播
酷播云免费在线视频整体解决方案
参与开学季云视频优惠,拿GET2017教育科技大会VIP门票
进入开学季,保利威视推出云视频优惠,云视频套餐、流量超实惠大放“价”就是现在,还可以免费获取GET2017教育科技大会VIP门票哦!