资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划,从策略到执行的一站式服务

html5中有哪些视频API接口

今天就跟大家聊聊有关html5中有哪些视频API接口,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。

创新互联建站是一家集网站建设,汉台企业网站建设,汉台品牌网站建设,网站定制,汉台网站建设报价,网络营销,网络优化,汉台网站推广为一体的创新建站企业,帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿,时刻以成就客户成长自我,坚持不断学习、思考、沉淀、净化自己,让我们为更多的企业打造出实用型网站。

一、虽然有的属性是boolean类型,但仍旧建议按照XHTML书写(属性名=”属性值”)格式,避免出现错误 (下面加粗的属性为常用属性)

属性功能描述
controlscontrols是否显示播放控件
autoplayautoplay设置是否打开浏览器后自动播放
widthPilex(像素)设置播放器的宽度
heightPilex(像素)设置播放器的高度
looploop设置视频是否循环播放(即播放完后继续重新播放)
preloadpreload设置是否等加载完再播放
srcurl设置要播放视频的url地址
posterimgurl设置播放器初始默认显示图片
autobufferautobuffer设置为浏览器缓冲方式,不设置autoply才有效

演示:


    
    

二、.video标签API方法:Video标签也提供了比较人性化的API接口方法,供写JS时直接调用,方便简单

API事件说明
addTextTrack()向音频/视频添加新的文本轨道。
playvideo.play();    播放视频
pausevideo.pause();  暂停播放视频
loadvideo.load();   将全部属性回复默认值,视频恢复重新开始状态
canPlayTypevar support = videoid.canPlayType('video/mp4');   判断浏览器是否支持当前类型的视频格式 返回值: 空字符串:不支持 Maybe:可能支持 Probably:完全支持

关于video标签的API接口在JS中用法如下:




    




    
    

播放
重新播放
浏览器支持



三、video标签API属性: Video不仅提供了API接口,还提供了许多的API属性,方便在JS中做判断,如下:大部分属性通过boolean值判断

API属性事件说明
duration返回媒体的播放总时长,单位秒
loop是否循环播放
muted是否静音
paused是否暂停
currentTime当前播放时间(单位:秒)
volume音量值(0~1)
networkState返回当前网络状态
playbackRate播放的倍速(加速、减速播放)(-2~2)
src当前视频源的URL
ended返回当前播放是否结束标志
error返回当前播放的错误状态
initialTime返回初始播放的位置
mediaGroup当前音视频所属媒体组 (用来链接多个音视频标签)
played当前播放部件已经播放的时间范围(TimeRanges对象)
preload页面加载时是否同时加载音视频
readyState返回当前的准备状态
seekable返回当前可跳转部件的时间范围(TimeRanges对象)
audioTracks返回可用的音轨列表(MultipleTrackList对象)
autoplay媒体加载后自动播放
buffered返回缓冲部件的时间范围(TimeRanges对象)
controller返回当前的媒体控制器(MediaController对象)
controls显示播控控件
crossOriginCORS设置
currentSrc返回当前媒体的URL
defaultMuted缺省是否静音
defaultPlaybackRate播控的缺省倍速
seeking返回用户是否做了跳转操作
startOffsetTime返回当前的时间偏移(Date对象)
textTracks返回可用的文本轨迹(TextTrackList对象)
videoTracks返回可用的视频轨迹(VideoTrackList对象)

演示

四、音频/视频事件

事件描述
abort当音频/视频的加载已放弃时触发。
canplay当浏览器可以开始播放音频/视频时触发。
canplaythrough当浏览器可在不因缓冲而停顿的情况下进行播放时触发。
durationchange当音频/视频的时长已更改时触发。
emptied当目前的播放列表为空时触发。
ended当目前的播放列表已结束时触发。
error当在音频/视频加载期间发生错误时触发。
loadeddata当浏览器已加载音频/视频的当前帧时触发。
loadedmetadata当浏览器已加载音频/视频的元数据时触发。
loadstart当浏览器开始查找音频/视频时触发。
pause当音频/视频已暂停时触发。
play当音频/视频已开始或不再暂停时触发。
playing当音频/视频在因缓冲而暂停或停止后已就绪时触发。
progress当浏览器正在下载音频/视频时触发。
ratechange当音频/视频的播放速度已更改时触发。
seeked当用户已移动/跳跃到音频/视频中的新位置时触发。
seeking当用户开始移动/跳跃到音频/视频中的新位置时触发。
stalled当浏览器尝试获取媒体数据,但数据不可用时触发。
suspend当浏览器刻意不获取媒体数据时触发。
timeupdate当目前的播放位置已更改时触发。
volumechange当音量已更改时触发。
waiting当视频由于需要缓冲下一帧而停止时触发。

看完上述内容,你们对html5中有哪些视频API接口有进一步的了解吗?如果还想了解更多知识或者相关内容,请关注创新互联行业资讯频道,感谢大家的支持。


文章题目:html5中有哪些视频API接口
URL分享:http://cdkjz.cn/article/ihhded.html
多年建站经验

多一份参考,总有益处

联系快上网,免费获得专属《策划方案》及报价

咨询相关问题或预约面谈,可以通过以下方式与我们联系

大客户专线   成都:13518219792   座机:028-86922220