HTML5視頻支持檢測(檢查瀏覽器是否支持視頻播放)

字號:


    HTML5 提供了展示視頻的標準。那么如何檢查你的瀏覽器是否支持視頻播放呢,下面與大家分享個小例子,感興趣的朋友可以了解下
    代碼如下:
    <STRONG>現(xiàn)在越來越多的網(wǎng)站都提供視頻播放(非插件)。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">
    <button onclick="checkVideo()">Check</button>
    </div>
    </div>
    </body>
    </html>
    下邊是js代碼:
    代碼如下:
    function checkVideo()
    {
    if(!!document.createElement('video').canPlayType)
    {
    //創(chuàng)建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))
    參數(shù)說明:
    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"