首页 > 其他分享> > JS检测浏览器是否支持视频、音频格式代码，一步检测浏览器支持视频音频格式

JS检测浏览器是否支持视频、音频格式代码，一步检测浏览器支持视频音频格式

2020-02-23 20:00:27 作者：互联网

使用audio元素的canPlayType检测浏览器支持的文件格式

该方法采用Mine类型和编解码器参数，并返回下列3个字符串值之一：probably/maybe/空字符串

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>测试浏览器是否支持某种视频音频格式</title>
    <script>
        function checkAudio() {
            var myAudio = document.createElement('audio');
            if (myAudio.canPlayType) {
                if ("" != myAudio.canPlayType('audio/mpeg')) {
                    document.write("您的浏览器支持mp3编码。<br>");
                }
                if ("" != myAudio.canPlayType('audio/ogg; codecs="vorbis"')) {
                    document.write("您的浏览器支持ogg编码。<br>");
                }
                if ("" != myAudio.canPlayType('audio/mp4; codecs="mp4a.40.5"')) {
                    document.write("您的浏览器支持acc编码。<br>");
                }
            } else {
                document.write("您的浏览器不支持要检测的音频格式。");
            }
        }
        window.onload = function () {
            checkAudio();
        }
    </script>
</head>
<body>
</body>
</html>

视频格式检测是一样的：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>测试浏览器是否支持某种视频视频格式</title>
    <script>
        function myVideo() {
            var myVideo = document.createElement('video');
            if (myVideo.canPlayType) {
                if ("" != myVideo.canPlayType('video/mp4; codecs="avc1.64001E"')) {
                    document.write("您的浏览器支持h264编码。<br>");
                }
                if ("" != myVideo.canPlayType('video/ogg; codecs="vp8"')) {
                    document.write("您的浏览器支持vp8编码。<br>");
                }
                if ("" != myVideo.canPlayType('video/ogg; codecs="theora"')) {
                    document.write("您的浏览器支持theora编码。<br>");
                }
            } else {
                document.write("您的浏览器不支持要检测的视频格式。");
            }
        }
        window.onload = function () {
            myVideo();
        }
    </script>
</head>

<body>
</body>

</html>

解启超发布了93 篇原创文章 · 获赞 36 · 访问量 2万+ 私信关注

标签：视频,浏览器,音频格式,myVideo,支持,write,canPlayType,document
来源： https://blog.csdn.net/xie_qi_chao/article/details/104465834