JS21---播放器

标签 video
标签属性 src 文件路径 autoplay自动播放 loop循环播放
controls控制条
可以通过h5给video提供的API 视频播放的功能：播放 暂停 快进 快退 进度条 时间 音量 全屏播放
在网站上看到的视频一般都是远程路径，本地路径浏览器兼容会有的属性用不了

h5里边自带进度条

 <progress></progress>
 <input type="range" name="" id=""/>

API（Application Programming Interface，应用程序接口）是一些预先定义的函数，或指软件系统不同组成部分衔接的约定。
目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力，而又无需访问原码，或理解内部工作机制的细节。
简单理解：api是直接可以调用的一种方法，一般说接口都是前后端对接的时候，之前百度搜索的api，是我们向百度请求，是百度已经写好的接口，我们去调用
下边是比较常用到的属性及方法
属性：duration 返回当前音频/视频的长度（以秒计）只有在视频开始播放或视频加载完成才可以获取到视频时间
currentTime 设置或返回音频/视频中的当前播放位置（以秒计）

事件 ：oncanplay 当浏览器可以播放音频/视频时（视频音频加载完成事件）
ontimeupdate 当目前的播放位置已更改时

属性

事件

vertical-align: middle; 竖直居中
　touchstart事件：当手指触摸屏幕时候触发，即使已经有一个手指放在屏幕上也会触发。

网页上边没有触屏，不可以用触屏事件
　　touchmove事件：当手指在屏幕上滑动的时候连续地触发。
在这个事件发生期间，调用preventDefault()事件可以阻止滚动。

touchend事件：当手指从屏幕上离开的时候触发。
　　clientX：触摸目标在视口中的x坐标。

clientY：触摸目标在视口中的y坐标。

pageX：触摸目标在页面中的x坐标。

pageY：触摸目标在页面中的y坐标。

screenX：触摸目标在屏幕中的x坐标。

screenY：触摸目标在屏幕中的y坐标。

target：触目的DOM节点目标。
　　鼠标事件
　　
视频音量条竖直（transform写兼容）
requestFullscreen（）屏幕放大放小 写兼容