

6.2.1 用javaScript检测音频格式支持
检测浏览器支持那些音频格式
function checkAudio(){
var myAudio = document.createElement('audio') #调用成员看是否存在,再检测文件格式
if (myAudio.canPlayType) { //返回空就是不支持
if ( "" != myAudio.canPlayType('audio/mpeg')) {
document.write("你的浏览器支持mp3编码");
。。。。
}
}
}
window.onload=-function()
{
checkAudio();
}
6.2.2 用JavaScript检测视频格式支持
function checkVideo(){
var myVideo = document.createElement('video') #调用成员看是否存在,再检测文件格式
if (myVideo.canPlayType) { //返回空就是不支持
if ( "" != myVideo.canPlayType('video/mp4;codecs="avc1.64001E"')) {
document.write("你的浏览器支持h264编码<br>");
。。。。
}
}
}
window.onload=-function()
{
checkVideo();
}
6.3.1 认识audio元素
h5用audio元素播放音频格式
<audio src="samplesong.mp3" controls="controls">
嵌入一些内容,在不支持的浏览器显示这里面的内容,也可以是其它声音链接等或object对象
</audio>
6.3.2 播放音频
<audio controls>
<source src= "medias/Wah Game Loop.ogg" type="audio/ogg">
<source src= "medias/Wah Game Loop.mp3" type="audio/mpeg">
这里是提示信息,当上面两种格式都不支持时显示这里的提示信息,上面是浏览根据选择
</audio>
插入背景音乐,循环播放
<audio autoplay loop> #循环播放
。。。声音文件
</audio>
6.4.1 认识video元素
播放视频文件或视频流,
<video src="samplemovei.mp4" controls="controls"> controls是控制的,暂停,开始等
你的浏览器不支持视频
</video>
6.4.2 播放视频
<video controls> #controls是控制的,暂停,开始,滚动条,时间等
src="samplemovei.mp4"
你的浏览器不支持视频
</video>
#没有controls就没有控制条
<video autoplay> 这样就会自动播放,没有控制条,不需要用户交互
也可以用js函数控制播放
load() 加载音频或视频文件,除非是动态生成的元素,否则不用
play(),pause(),canPlayType(type) 播放,暂停,检测是否可播放
<video id="movies" onmouseover="this. #移动鼠标到上面就播放
6.5.1 音频与视频相关属性
audio与video属性基本相同
autobuffer属性,可以使自动缓存,默认flase,即不缓存,
有autoplay上面的就自动忽略
buffered 确认浏览器已缓存文件
controls="controls" 显示控制条
currentSrc 返回煤体的url
currentTime 当前播放的位置,单位为秒
defalutPlaybackRate 得到当前播放的速率
duration 只读属性,当前煤体播放时间
ended 是否播放结束得到
error 返回一个,提示错误
initialTime 获取最早就放的位置
loop 中读写属性,是否重复播放
muted 是否开启静音
networkState 状态,未初始化,加载完成,
paused 是否暂停播放
playbackRate 返回一个对象
preload 是否预加载
readyState 当前播放位置 4表正在播放
seekable 前当煤体请求
seeking 是否正在播放
src 路径信息
volume 音量控制
6.5.2 音频与视频相关方法
canPlayType 是否播放指定类型,返回值
probably,确定支持此媒体类型
maybe 可能支持
空 不支持
load 重置媒体并重新载入
pause 暂停播放
play
6.5.3 音频与视频相关事件
addEventListener("事件名",事件名,处理方式) #事件处理函数
音频与视频相关事件表见视频
abort canplay....,需要时对着表查询
6.6.1 用脚本控制音乐播放
播放音频,但不要默认的控制条,自定义一个用户界面进行控制
6.6.2 查看视频帧画面
隔一段时间抓取视频的画在存放在画布里,以九宫格的形式存放,点击九宫格可跳到相关的帧播放
autobuffer="true"自动播放 autoplay
oncanplay="startVideo()" onended 播放开始和停止调用函数
5秒切取一个画面
intervalId
updateInterval 控制抓取间隔
stopTimeline()函数 停止抓取
视频控制到画布完美结合起来