HTML代码判断视频兼容

随着移动互联网的迅速发展，网页上的视频已经成为很常见的一种媒体形式。不同的浏览器和操作系统对于视频格式支持的程度不同，因此在网页中嵌入视频时需要对不同浏览器进行兼容性处理。接下来介绍如何通过HTML代码进行视频兼容性判断。

video标签

HTML5引入了video标签，可以通过该标签嵌入视频。但是不同浏览器和操作系统对于video支持的视频格式不同，因此需要判断当前浏览器是否支持video标签以及支持何种视频格式。下面是一个判断是否支持video标签的代码：

if(typeof videoElement.canPlayType === 'function') {
        var playable = videoElement.canPlayType('video/mp4;
     codecs="avc1.42E01E,mp4a.40.2"');
    if(playable === 'probably') {
            console.log('支持video标签');
    }
}
	

上述代码判断浏览器是否支持video标签，并且是否支持mp4视频格式。

flash嵌入视频

在一些老版本的浏览器中不支持video标签，而是需要通过flash来嵌入视频。下面是一个判断浏览器是否支持flash的代码：

function detectFlash() {
        var hasFlash = false;
    try {
            var fo = new ActiveXObject('ShockwaveFlash.ShockwaveFlash');
            if(fo) hasFlash = true;
    }
 catch(e) {
            if(navigator.mimeTypes['application/x-shockwave-flash'] != undefined) hasFlash = true;
    }
        return hasFlash;
}
if(detectFlash()) {
        console.log('支持flash嵌入视频');
}
    	

上述代码通过检测浏览器是否安装了Flash插件来判断浏览器是否支持flash嵌入视频。

总结

通过以上代码可以对不同浏览器进行视频兼容性判断，从而选择合适的嵌入方式。同时，在视频编码时也需要注意选择浏览器支持的视频格式，以保证视频能够正常播放。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！