• 售前

  • 售后

热门帖子
入门百科

HTML5视频支持检测(检查浏览器是否支持视频播放)

[复制链接]
张永峰 显示全部楼层 发表于 2021-10-25 20:00:47 |阅读模式 打印 上一主题 下一主题
复制代码代码如下:
<STRONG>现在越来越多的网站都提供视频播放(非插件)。HTML5 提供了展示视频的尺度。那么怎样查抄你得欣赏器是否支持视频播放呢,下面我们来写一个列子。</STRONG>


复制代码代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<body>
<h1>HTML 5 视频</h1>
<p>检测您的欣赏器是否支持 HTML5 视频:</p>
<div id="checkVideoResult" style="margin:10px 0 0 0; border:0; padding:0;">
<button style="font-family:Arial, Helvetica, sans-serif;" >Check</button>
</div>
</div>
</body>
</html>

下边是js代码:

复制代码代码如下:
function checkVideo()
{
if(!!document.createElement('video').canPlayType)
{
//创建video元素
var vidTest=document.createElement("video");
//检测是否可以播放ogg格式的视频
oggTest=vidTest.canPlayType('video/ogg; codecs="theora, vorbis"');
if (!oggTest)
{
//检测是否可以播放MP4格式的视频
h264Test=vidTest.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"');
if (!h264Test)
{
document.getElementById("checkVideoResult").innerHTML="Sorry. No video support."
}
else
{
if (h264Test=="probably")
{
document.getElementById("checkVideoResult").innerHTML="Yes! Full support!";
}
else
{
document.getElementById("checkVideoResult").innerHTML="Well. Some support.";
}
}
}
else
{
if (oggTest=="probably")
{
document.getElementById("checkVideoResult").innerHTML="Yes! Full support!";
}
else
{
document.getElementById("checkVideoResult").innerHTML="Well. Some support.";
}
}
}
else
{
document.getElementById("checkVideoResult").innerHTML="Sorry. No video support."
}
}


复制代码代码如下:
canPlayType方法阐明:
1.界说:检测欣赏器是否能播放指定的音频/视频范例。
2.返回值:
"probably" ,表示欣赏器最大概支持该视频或音频。
"maybe" ,表示欣赏器大概支持该视频或音频。
"" (空字符串),表示欣赏器不支持该视频或音频。
注:Internet Explorer 8 以及更早版本不支持该方法。
语法:audio|video.canPlayType(type))
参数阐明:
type:要检测的音频或视频范例,
常用值:video/ogg;video/mp4;video/webm; audio/mpeg;audio/ogg;audio/mp4
常用值(包括要检测的音频或视频编解码器):
video/ogg; codecs="theora, vorbis"
video/mp4; codecs="avc1.4D401E, mp4a.40.2"
video/webm; codecs="vp8.0, vorbis"
audio/ogg; codecs="vorbis"
audio/mp4; codecs="mp4a.40.5"

帖子地址: 

回复

使用道具 举报

分享
推广
火星云矿 | 预约S19Pro,享500抵1000!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

草根技术分享(草根吧)是全球知名中文IT技术交流平台,创建于2021年,包含原创博客、精品问答、职业培训、技术社区、资源下载等产品服务,提供原创、优质、完整内容的专业IT技术开发社区。
  • 官方手机版

  • 微信公众号

  • 商务合作