Html_video 标签

video标签中有音频播放地址，如果src中有blob，则表示是一个虚拟地址，防止视频被下载

<video  
    id = “_volume”
    src = "视频地址" width = "宽度" height = "高度"
    controls //(#控制播放#) 
    controslist = "nodownload //(#隐藏下载按钮#)
    nofullscrean ///(#隐藏全屏按钮#) ........自行百度其他命令"
    poster = "图片地址" //(#video 贴图#)
    autoplay //(#自动播放#)
    muted //(#默认视频初始为静音状态#)
    loop //(#循环播放#)
    preload //(#预加载#)
    volume = "0~1"//表示音量大小 需要通过js控制 Ps.本身并不起作用
>

</video>
<scrpit type = "text/javascript">
    var v = document.getElementById('_volume');
    v.volume = 0.5（#控制video的音量属性#）

    v.currentTime(#获取当前播放到的时间，单位为s（秒）#)
    v.currentTime = 60; (#定位到第60s#)

    v.src （#获取视频播放地址#）
    v.src = '另一个视频的地址'； （#切换播放的视频，例如低清，高清，超清的切换#）

    v.currentSrc （#当video没有src标签，而使用下面所用的source方式，获取当前的真实播放地址#）
</script>

<video controls poster = "封面图片" width = "" height = "">（#备用地址的使用#）
    <source src = "视频的播放地址" type = "video/mp4">
    <source src = "视频2的播放地址" type = "video/mp4" >(#当第一个source 的视频地址索引失败的时候，转切第二个#)
</video>

video 可以使用的事件
全部在js文件中
预定义：var v = document.getElementById ('video');

视频查找        v.addEventListener('loadstart', function(e){ 操作 })      
              （#视频播放的时候，最开始触发的事件#）
时长变化        v.addEventListener('durationchange', function(e){ 操作 })     
              （#视频的时长并非在video创建的时候就可以得到，而是要在加载完源信息之后才能得到，所以在‘loadstart’之前，v.duration 这个值为nan（空）。有时得到的并不是总时长，与视频时长有关#）
元数据加载   v.addEventListener('loadedmetdata', funtion(e){ 操作 }）   
              （#在视频元数据下载完之后才会执行的函数#）
视频下载监听  v.addEventListener('progress', funtion(e){ 操作 })        
              （##）
可播放监听   v.addEventListener('canplay', funtion(e){ 操作 })     
              （#视频加载（可能是部分下载完毕），可以播放了#）
            v.addEventListener('canplaythrough', funtion(e){ 操作 }) 
              （#全部加载完毕，可以流畅的播放#）
播放监听        v.addEventListener('play', funtion(e){ 操作 })        
              （#每次点击播放，开始播放的时候就会触发，这时候不一定可以播放（可能加载的帧数不够）#）
暂停监听        v.addEventListener('pause', funtion(e){ 操作 })       
              （#暂停，与播放类似#）
查找开始        v.addEventListener('seeking',funtion(e){ 操作 })      
              （#直接点击进度条#）
查找结束        v.addEventListener('seeded', funtion(e){ 操作 })      
              （#表示上述的seek结束#）
视频加载等待  v.addEventListener('waiting', funtion(e){ 操作 })     
              （#当progress触发失败或者progress加载的帧数不足以播放时，触发此监听事件#）
视频结束        v.addEventListener('ended', funtion(e){ 操作 })       
              （#当视频播放结束时触发#）
做一个自定义进度条   v.addEventListener('timeupate', funtion(e){ 操作 })       
              （#时间点变化时触发timeupdate#）
视频播放错误  v.addEventListener('error', funtion(3){ 操作 })       
              （#无法连接到视频源或者其他错误的时候，浏览器会尝试重新连接31次，之后就会触发error事件#）

猜你喜欢