檢測瀏覽器是否支持html5視頻的代碼

2024-08-26 00:16:04

字體：大中小

來源：轉載

供稿：網友

點評：學習w3c是看到一個檢測您的瀏覽器是否支持 HTML5 視頻的方法，在這里與大家分享下，感興趣的各位可以參考下哈，希望可以幫助到你

在學習html5的時候，看到一個檢測您的瀏覽器是否支持 HTML5 視頻的方法：

運行效果：

1.在EditPlus中運行

檢測瀏覽器是否支持html5視頻的代碼

2.在chrome瀏覽器中運行

檢測瀏覽器是否支持html5視頻的代碼

=======================================================

代碼部分：

=======================================================

復制代碼

代碼如下:

<!DUCTYPE HTML>
<html>
<script type="text/javascript">
function checkVideo()
{
if(!!document.createElement('video').canPlayType)
{
var vidTest=document.createElement("video");
oggTest=vidTest.canPlayType('video/ogg; codecs="theora, vorbis"');
if (!oggTest)
{
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."
}
}
</script>
<body>
<p>檢測您的瀏覽器是否支持 HTML5 視頻：</p>
<div>
<button>Check</button>
</div>
</body>
</html>