1、video标签的作用

video标签时用来定义视频播放器的，而且他还可以实现自定义播放、暂停、进度和控制等控制栏的功能

video标签的使用方法，如下：

<video src = "视频文件路径" controls>你的浏览器不支持video标签</video>
/*
其中src时video的基本属性用于存放视频文件路径，
而controls是video标签提供的一套默认的控制栏功能，
其中包含了播放、暂停、进度和控制等功能，
而video标签中包含的文字是用于浏览器不支持时显示的
*/

这里为了让尽量多的浏览器都能显示出video标签我们使用这样的语法

<video controls>
	<source src = "视频文件路径" type = "video/格式">
	<source src = "视频文件路径" type = "video/格式">
	...
</video>

通过在video中使用更多的视频格式，从而兼容更多的浏览器

2、video标签用于视频播放的常用属性

属性

允许取的值

取值的说明

autoplay

autoplay

如果出现了该属性，则视频在缓冲就绪后马上播放

controls

controls

如果出现了该属性，则向用户显示控件，比如播放按钮

height

px（多少像素）、100%

设置视频播放器的高度

width

px（多少像素）、100%

设置视频播放器的宽度

loop

loop

如果出现该属性，则当媒体文件播放完后再次播放（循环播放）

preload

preload

如果出现该属性，则视频在页面加载时进行加载，并预备播放。如果使用了autoplay，则忽略该属性）

src

视频文件的路径

视频文件的路径

3、video对象的常用方法

方法

方法描述

load()

该方法用于加载视频文件，为播放做准备。常用于播放前的预加载，也会用于重新加载媒体文件

play()

用于播放视频文件。如果视频没有加载，则加载并播放；如果视频时暂停的，则变为播放

pause()

暂停视频

canPlayType()

测试浏览器是否支持指定的视频类型

4、video对象的常用属性

属性

属性描述

currentSrc

返回当前视频文件的地址

currentTime

设置或者返回视频中的当前播放位置（以秒为单位）

duration

返回视频的长度（以秒为单位）

ended

返回视频的播放是否以及结束

error

返回视频错误状态的MediaError对象

paused

设置或者返回视频是否暂停

muted

设置或者返回视频是否关闭声音

volume

设置或者返回视频的音量大小

height / width

设置或者返回视频的高度值 / 宽度值