H5学习系列之Audio和Video

Posted 2020-06-18

1、视频文件：音频轨道、视频轨道和一些元数据（视频封面、标题、子标题、字幕等相关信息）。

2、目前H5还不支持的：流式音频和视频（H5对视频的支持只限于加载的全部媒体文件）、H5的媒体收到跨域资源共享的限制、全屏无法通过脚本控制。

3、检测浏览器是否具有播放视频的功能

var canPlay = document.createElement("video").canPlayType;
if (canPlay) {alert("ok");}
else {alert(‘error‘);}  //其实就是检测浏览器是否具有canplaytype函数

4、audio 

<audio controls src="/张含韵 - 问别.mp3">
An audio clip from johann sebastian bach
</audio>

代码中controls 特性告诉浏览器显示通过的用户控制（开始、停止、跳播、以及音量控制），她之间的内容是为不支持audio元素的浏览器准备的替换内容

<audio controls >
An audio clip from johann sebastian bach
</audio>