HTML5中视频音频的使用详解
来源:诚信在线下载    发布时间:2017-07-15 07:35:43

  muted

  罕用API属性

  //经由过程document去获得曾经存在的Audio工具

  load()

  客户端在要求数据

  controls

  播放 

  readyState

  playing

  能否停息 

  2.2 audio标签中的一些罕用属性

  play

  配置或者返回音频/视频是不是静音

  客户端起头要求数据

  1.4.二收集状况

  9.Media.ended; 

  返回默示以后时候偏移的 Date 工具

  能否收场 

  IE9

  配置能否等加载完再播放

  返回值:

  duration

  入手下手回放

  error

  留意:多个source标签,浏览器会从第一个入手下手辨认,假如第一个没有被辨认,则会连续辨认第二个;若是第一个辨认乐成,则会间接播放第一种花式视频

  2.退出全屏:

  给定多种视频格式,浏览器依据本身支撑水平挑选播放哪一种

  startDate

  视频编码:H.264、Theora、VP8(谷歌开源)

  Pilex(像素)

  寻觅外

  寻觅终了

  返回表现音频/视频已经缓冲全体的 TimeRanges 工具

  用来猎取或者配置静音状况。值为boolean

  撑持

  3.Media.duration; 

  两、audio

  2.Media.startTime; 

  以后资本长度 流返回无穷 

  autobuffer

  果断浏览器能否支撑以后范例的视频格式

  networkState

  pause

  歌曲曾经载入完整实现

  auto: 

  controls

  played

  loop

  属性值

  autoplay

  返回透露表现可用视频轨道的 VideoTrackList 工具

  能否表现播放控件

  配置播放器的高度

  管制音量的属性值为0-一;0为音量最小,一为音量最大

  6.Media.playbackRate = value; 

  一、Ogg 

  属性

  progress

  猎取媒体文件的总时长,以s为单元,要是没法获得,返回NaN

  currentTime

  撑持的浏览器:F、C、O 

  返回透露表现音频/视频已经播放局部的 TimeRanges 工具

  返回用户能否在音频/视频外停止查找

  客户端开端哀求数据

  2.3 api所供给的对于audio标签操纵的一些属性战办法

  loop

  audioTracks

  5.Media.load(); 

  返回以后音频/视频的 URL

  停息出于播放状况的音频、视频文件

  撑持

  正文

  撑持的浏览器: I、F、C、O 

  2.罕用变乱 

  支撑

  src

  以字符串模式返回在播放或者已经加载的文件

  播放完结

  1.4.六 相干变乱

  1.Media.currentSrc; 

  返回能够seek的地区 TimeRanges 

  2.Media.src = value; 

  loadeddata

  测试能否撑持给定的Mini范例的文件

  //经过new关键字去建立Audio工具

  客户端入手下手要求数据

  suspend

  video.pause(); 停息播放视频

  能否轮回播放 

  Chrome

  controls

  轮回播放

  守候数据,并不是搭档

  stalled

  配置要播放视频的url地点

  height

  canplay

  13.Media.pause(); 

  描写

  video.load(); 将全体属性复原默认值,视频复原从头入手下手形态

  播放时光改观

  currentTime

  loadedmetadata

  MP3

  load

  通常为0,假如为流媒体大概没有从0起头的资本,则没有为0 

  优势:视频长、转码器几乎没有,没有好转码 

  Media.volume = value; //音量

  1.3 紧张的video标签属性

  罕用方式

  imgurl

  autoplay

  Media.controls;//是不是有默许操纵条

  恳求数据时碰到过错

  停息 

  url

  2.HTML5撑持的音频格式:

  猎取video工具

  Wav 免费 支撑的浏览器: F、O、S

  pause():停息以后播放的音频/视频

  durationchange

  muted

  canPlayType(obj)

  1.Media.currentTime = value; 

  配置或者返回音频/视频的默许播放速率

  指定一种视频格式,不克不及播便提醒

  currentTime:配置或者返回音频/视频中的以后播放地位(以秒计)

  提早下载

  progress

  预加载(正在页面被加载时举行加载或道缓冲音频),若是运用了autoplay的话那末该属性生效。

  配置为浏览器缓冲体例,没有配置autoply才有用

  8.Media.seekable; 

  TimeRanges.start(index) //第index段地区的起头地位

  返回音频/视频的播放能否已经停止

  Firefox

  能够播放,但半途能够由于加载而停息

  撑持

  WAV

  1.全屏:

  1.4.四 回放状况

  TimeRanges.end(index) //第index段地区的终了地位

  撑持的浏览器: S、C 

  playbackRate

  返回默示可用音轨的 AudioTrackList 工具

  document.exitFullscreen(); (W3C)

  音频编码:ACC、MP3、Vorbis 

  ended:返回音频/视频的播放能否未完毕

  想要video能主动添补缓女div的巨细,只需给video标签加之style="width= 100%; height=100%; object-fit: fill"便可

  width

  返回已播放的地区,TimeRanges,闭于此工具睹下文 

  11.Media.loop; 

  src

  不支持

  假如媒体文件被停息,那末paused属性返回true,反之则返回false

  autoplay

  OGG

  canplaythrough

  crossOrigin

  音量改动

  textTracks

  返回示意音频/视频以后媒体控制器的 MediaController 工具

  waiting

  timeupdate

  6.Media.buffered; 

  ended

  loop

  element.webkitRequestFullScreen();( webkit)

  1.4 Video API

  var Music = document.getElementById("audio");

  事务称号

  progress

  感化

  preload

  配置或者返回音频/视频的音量

  volume

  -

  document.webkitCancelFullScreen(); (webkit )

  不支持

  撑持

  error

  不支持

  配置或者返回音频/视频是不是停息

  2.Media.seeking; 

  //webm体例

  duration:返回以后音频/视频的长度(以秒计)

  Media.muted = value; //静音

  Ogg 收费 支撑的浏览器:C、F、O

  1.常见的音频格式

  TimeRanges.length; //地区段数

  总结

  ended

  onended:当序言未抵达末端时运言的剧本(否发送雷同“谢谢寓目”之类的音讯)。

  配置或者返回音频/视频默许是不是静音

  从新加载src指定的资本 

  videoTracks

  play

  //src属性写到source标签外,要指定视频的type范例,比方MP4的即为type=“video/mp4”

  用来获得或者管制以后播放的工夫,单元为s。

  ended

  ended

  二、MEPG4 

  以上便是这篇文章的全部内容了,但愿本文的内容对于人人的进修大概事情能带来未必的赞助,要是有疑难大师能够留言交换,感谢大师对于剧本之野的撑持。

  返回表现可用文本轨道的 TextTrackList 工具

  defaultMuted

  abort

  能够播放,歌曲所有加载结束

  timeupdate

  客户端在要求数据

  canplay

  buffered

  Pilex(像素)

  mediaGroup

  7.Media.preload; 

  你的浏览器不支持video

  12.Media.play(); 

  变乱感化

  API 属性 

  函数

  配置视频是不是轮回播放(即播放完后接续从头播放)

  对音乐格式的撑持 

  带有Theora视频编码+Vorbis音频编码的Ogg文件 

  以后播放停止

  audio否经由过程new去创立。也能够经过用document去猎取

  var Music = new Audio("test.mp3");

  能否能播放某种款式的资本 

  Media = document.getElementById("media");

  preload

  3.Media.canPlayType(type); 

  实在video的api战audio几近同等。稍稍有点差别。以是基本上会了一个其余的也便都市了

  加载并播放音频、视频文件或者从头播放停息的的音频、视频

  事务

  支撑

  duration

  属性

  1.起首绑定事宜的话能够经由过程js中的addEventListener办法去绑定事务 

  不支持

  pause

  返回音频/视频以后的停当形态

  seeked

  preload

  1.4.五 视频节制

  poster

  MP3 免费 撑持的浏览器: I、C、S

  返回以后资本的URL 

  2.4 罕用的节制用的函数

  返回未缓冲地区,TimeRanges 

  seekable

  配置能否关上浏览器后主动播放

  起首绑定事宜的话能够经过js中的addEventListener要领去绑定事宜  

  0.此元素已初始化 

  不支持

  返回以后音频/视频的长度(以秒计)

  音频格式

  返回暗示音频/视频否寻址部门的 TimeRanges 工具

  pause()

  1.2 标签原型

  返回音频/视频的以后收集状况

  10.Media.autoPlay; 

  startTime

  配置或者返回音频/视频所属的组合(用于联接多个音频/视频元素)

  error

  element.requestFullscreen(); (W3C )

  网速失速

  带有VP8视频编码+Vorbis音频编码的WebM花式 

  解释

  1.失常但不应用收集 

  metadata:预载资本信息 

  ratechange

  volumechange

  preload

  pause

  2.5 audio标签API中的经常使用事情

  var support = videoid.canPlayType(‘video/mp4′); 

  能否在seeking 

  配置或者返回音频/视频播放的速率

  loadstart

  空字符串:不支持Maybe:大概撑持Probably:完整撑持

  能否主动播放 

  loadstart

  play()以及autoplay播放时

  带有H.264视频编码+AAC音频编码的MPEG4文件 

  oncanplay:当文件停当能够入手下手播放时运言的剧本(缓冲已经充足入手下手时)。

  1.Media.readyState 

  url

  配置播放器的宽度

  video.play(); 播放视频

  视频的组成部分:画面、音频、编码花式

  element.mozRequestFullScreen(); (Firefox )

  loadstart

  4.Media.paused; 

  ontimeupdate: 当播放地位改观时(好比当用户快进到前言外一个分歧的地位时)运转的剧本。

  play()以及autoplay开端播放时触发

  3.不找到资本 

  2.在下载数据 

  假如媒体文件播放结束返回true

  volume

  document.mozCancelFullScreen(); (Firefox)

  资本长度改动

  controls

  胜利猎取资本长度

  1、video

  主动播放

  pause()触发

  返回暗示音频/视频同伴状况的 MediaError 工具

  4.Media.networkState; 

  currentSrc

  加载音频、视频软件

  变乱注明

  1.1 video支撑视频格式

  缓冲至今朝否播放状况。

  支撑

  不支持

  客户端自动停止下载(不是由于毛病引发)

  play()

  配置播放器初始默许表现图片

  paused:配置或者返回音频/视频能否停息

  paused

  返回错误代码,为uull的时辰为一般。不然能够经由过程Music.error.code去获得

  pause()法子促发时

  返回或者配置以后资本的URL 

  1.4.一 Video 方式

  不支持

  解释

  功用形貌

  属性(经常使用)

  默许的回放速率,能够配置 

  播放速度转变

  play

  1.4.七 其余

  none:不预载 

  canPlayType

  Safari

  属性

  play():开端播放音频/视频

  以后播放时候产生改动的时刻。播放外经常使用的光阴处置惩罚

  1.4.三 预备形态

  HTML5撑持的视频格式:

  autobuffer

  defaultPlaybackRate

  seeking

  7.Media.played; 

  Opera

  播放的音乐的url地点(火狐只撑持ogg的音乐,而IE9只撑持MP3格局的音乐。chrome貌似齐支撑)

  客户端在要求数据(大概道在缓冲)

  是不是表现默许管制条(管制按钮)

  paused

  canplaythrough

  5.Media.defaultPlaybackRate = value; 

  controller

  TimeRanges(地区)工具

  2.1 audio格局

  autoplay

  seeking

  值

  配置或者返回音频/视频的 CORS 配置

  //ogg花样

  常见的视频格式

  以后播放的地位,赋值否转变地位 

  配置或者返回音频/视频中的以后播放地位(以秒计)

  currentSrc

  以后播放速率,配置后立刻改动 

  返回肇始播放工夫

  支撑

  loop

  //固然此处也能够应用document.getElementsByClassName('className')等其余的方式去猎取。

  三、WebM 

  API


诚信在线下载 除注明原创以外,其余均来自互联网以及微信朋友圈,如有侵权请联系站长立即删除!
文章地址:http://www.shjdingwei.com/WLBC/20170715275.html



上一篇:html5嵌入内容 下一篇:SEO优化干货什么样的网站页面才算是高质量的页面