https://blog.csdn.net/zhuchunyan_aijia/article/details/52277846
属性介绍
属性 | 说明 |
---|
controls | 显示标准的 HTML5 视频/音频播放器控制条、控制按钮。 |
autoplay | 让文件自动播放。 |
loop | 让文件循环播放。 |
preload | 属性是用来缓存大体积文件的。它有三个可选值:“none” 不缓存、“auto” 缓存、“metadata” 只缓存文件元信息 |
poster | 视频封面 |
webkit-playsinlin=“true” | 这个属性在 ios 10中设置有用,其他的目前还不起作用,让视频在小窗内播放,也就是不是全屏播放 |
playsinline=“true” | IOS微信浏览器支持小窗内播放 |
x5-video-player-type=“h5” | 启用H5播放器,是wechat安卓版特性 |
x5-video-player-fullscreen=“true” | 全屏设置,设置为 true 是防止横屏 |
x5-video-orientation=“portraint” | 播放器屏幕的方向,landscape横屏,portraint竖屏,默认值为竖屏。 |
source | 标签是为了能够兼容各种浏览器对不同媒体类型的支持,我们可以用多个source元素来提供多个不同的媒体类型。支持mp4格式视频流的浏览器可以播放mp4文件,如果不支持,可以播放ogg文件。 |
codecs=dirac, speex | 是用来指定播放使用的解码器(codecs); 这样就可以更精确的让浏览器如何播放提供的视频。 |
方法介绍
只读属性
duration
startTime
paused
ended
error
currentSrc
buffered
可控制属性
src
autoplay
preload
loop
controls
autobuffer
muted
volume
currentTime
load()
paly()
pause()
canPlayType(obj)
loadstart
progress
play
pause
ended
timeupdate
canplaythrough
canplay
onloadedmetadata
事件介绍
事件 | 描述 |
---|
loadstart | 浏览器开始在网上寻找媒体数据 |
progress | 浏览器正在获取媒体数据 |
suspend | 浏览器暂停获取媒体数据,但是下载过程并滑正常结束 |
abort | 浏览器在下载完全部媒体数据之前中止获取媒体数据,但是并不是由错误引起的 |
error | 获取媒体数据过程中出错 |
emptied | video元素或audio元素所在网络突然变为未初始化状态可能原因有两个:1.载入媒体过程中突然发生一个致命错误 2.在浏览器正在选择支持的播放格式时,又调用 了load方法重新载入媒体 |
stalled | 浏览器尝试获取媒体数据失败 |
play | 即将开始播放,当执行了play方法时触发,或数据下载后元素被设为autoplay属性 |
pause | 播放暂停,当执行了pause方式时触发 |
loadedmetadata | 浏览器获取完毕媒体的时间长和字节数 |
waiting | 播放过程由于得不到下一帧而暂停播放(例如下一帧尚未加载完毕),但很快就能够得到下一帧 |
canplay | 浏览器能够播放媒体,但估计以当前的播放速率不能直接播放完毕,播放期间需要缓冲 |
canplaythrough | 浏览器能够播放媒体,而且以当前播放速率能够将媒体播放完毕,不再需要进行缓冲 |
seeking | seeking属性变为true,浏览器正在请求数据 |
seeked | seeking属性变为false,浏览器停止请求数据 |
timeupdate | 由于播放位置被改变,可能是播放过程中的自然改变,也可能是被人为的改变,或由于播放不能连续而发生的跳变 |
ended | 播放结束后停止播放 |
ratechange | defaultplaybackRate属性(默认播放速率)或playbackRate属性(当前播放速率)被改变 |
druationchange | 播放时长被改变 |
volumechange | volume属性(音量)被改变或muted属性(静音状态)被改变 |
一段断点续传的加载记录:
emptied video元素或audio元素所在网络突然变为未初始化状态可能原因有两个:1.载入媒体过程中突然发生一个致命错误 2.在浏览器正在选择支持的播放格式时,又调用 了load方法重新载入媒体
timeupdate 由于播放位置被改变,可能是播放过程中的自然改变,也可能是被人为的改变,或由于播放不能连续而发生的跳变
loadedmetadata 浏览器获取完毕媒体的时间长和字节数
progress 浏览器正在获取媒体数据
canplay 浏览器能够播放媒体,但估计以当前的播放速率不能直接播放完毕,播放期间需要缓冲
play 即将开始播放,当执行了play方法时触发,或数据下载后元素被设为autoplay属性
canplaythrough 浏览器能够播放媒体,而且以当前播放速率能够将媒体播放完毕,不再需要进行缓冲
progress 浏览器正在获取媒体数据
timeupdate
progress 浏览器正在获取媒体数据
timeupdate
progress 浏览器正在获取媒体数据
timeupdate
progress 浏览器正在获取媒体数据
timeupdate
timeupdate
......
timeupdate
timeupdate
timeupdate 由于播放位置被改变,可能是播放过程中的自然改变,也可能是被人为的改变,或由于播放不能连续而发生的跳变
waiting 播放过程由于得不到下一帧而暂停播放(例如下一帧尚未加载完毕),但很快就能够得到下一帧
timeupdate 由于播放位置被改变,可能是播放过程中的自然改变,也可能是被人为的改变,或由于播放不能连续而发生的跳变
stalled 浏览器尝试获取媒体数据失败