HTML5新增的部分内容

1.新增input里type值：number，email，date，time，color

2.标签属性：

• contentediable="true/false",让标签内容可编辑；
• draggable：使元素可拖拽，有七个事件
  • 被拖拽元素的事件
    • dragstart：拖拽开始
    • drag：移动
    • dragend：结束拖拽
  • 目标区域：
    • drapenter：进入目标区域
    • dragover：在目标在
    • drapleave：离开目标
    • drap：在目标中放下

3.音视频 video  <video src="视频地址"></video>

<!-- 兼容处理 -->

浏览器按source标签的顺序检测标签指定的视频是否能够播放（可能是视频格式不支持，视频不存在等等），如果不能播放，换下一个。此方法多用于兼容不同的浏览器。Source标签本身不代表任何含义，不能单独出现。

<video>
    <source src = "">
    <source src = "">
    <source src = "">
    您的浏览器版本过低，无法使用视频!
</video>

属性

• controls：是否需要浏览器启用本身的播放控制栏。

• autoplay：用于设置视频是否自动播放（前提是要设置静音）

• muted： 静音

• paused：判断当前视频是否是暂停状态

• loop: 用于指定视频是否循环播放

• currentTime: 当前视频的播放时间点

• durantion ：视频的总时长

• volume：音量   

• poster：指定视频第一帧的画面

• preload: 预加载方案

  1. metadata 元数据，只预加载视频的总时长，和第一帧的内容

  2. auto： 自动预加载，视频的总时长，并缓冲一定的内容和第一帧的内容

  3. none：不进行预加载。使用此属性值，可能是页面制作者认为用户不期望此视频，或者减少HTTP请求。

• playbackRate：改变视频的播放速度，默认值1

方法

• play() 让视频播放

• pause() 让视频暂停

video.onload = function(){
    video.play();
}

事件

• onplay()：视频播放时执行

• onplaying()：暂停后准备播放执行

• onpaused()：暂停执行