video以及audio标签的使用 也就是视频与音频
video标签默认为inline-block，宽高默认为300*150
属性：
autoplay 自动播放 不过在谷歌中不能自动播放，除非你设置静音 muted
controls 是否显示播放控件
currentTime 播放到的当前时间
duration 影片的总时长
ended 是否播放到结尾了
loop 是否循环播放
paused 当前是否处于暂停状态
preload 预加载
auto 视频的宽高 时长 第一帧的 内容 并且缓冲一定的时长
metadata : 视频的宽高 时长 第一帧的 内容
none:不预加载任何内容
不过如果已经设置了autoplay则忽略此属性
方法：
play()开始播放
pause()暂停播放
draggable 可拖拽属性的使用
拖拽的声明周期：
1、拖拽开始
2、拖拽进行中
3、拖拽结束
拖拽的组成
被拖拽的物体
目标区域
<div class="draggable-box" draggable = "true" ></div>这是一个可拖动的div
<div class="target"></div> 这是我们要拖动过去的目标
首先我们得拿到拖拽得标签
var oDragDiv = document.getElementsByClassName("draggable-box")[0]；
然后通过事件对象来操作
oDragDiv.ondragstart = function (e) {} 在开始移动的时候触发的事件
oDragDiv.ondrag = function (e){} 在移动中出发的事件
目标元素的事件
var oDragTarget = document.getElementsByClassName('target')[0]
oDragTarget.ondragenter = function (e) {} 拖拽元素进入目标元素时触发，当鼠标进入时才触发
oDragTarget.ondragover = function(e) {
e.preventDefault();//在这个事件中应该添加拖拽事件的结束，这样被拖拽过来的元素便不会回到原位
} 在目标元素中移动中触发
oDragTarget.ondragleave = function (e) {} 离开目标元素时触发
oDragTarget.ondrop = function (e) {} 移动的元素从目标元素中离开以后触发