HTML 5 Video + DOM

w3school 在线教程

## HTML5 教程

- HTML5 教程
- HTML5 简介
- HTML5 视频
- HTML5 视频/DOM
- HTML5 音频
- HTML5 拖放
- HTML5 画布
- HTML5 SVG
- HTML5 画布 vs SVG
- HTML5 地理定位
- HTML5 Web 存储
- HTML5 应用缓存
- HTML5 Web Workers
- HTML5 服务器发送事件

## HTML5 表单

- HTML5 输入类型
- HTML5 表单元素
- HTML5 表单属性

## HTML5 测验

- HTML5 测验

## HTML5 参考手册

- HTML5 标签
- HTML5 属性
- HTML5 事件
- HTML5 视频/音频
- HTML5 画布
- HTML 有效 DTD

# HTML 5 Video + DOM

- HTML5 视频
- HTML5 音频

## HTML5 <video> - 使用 DOM 进行控制

HTML5 <video> 元素同样拥有方法、属性和事件。

其中的方法用于播放、暂停以及加载等。其中的属性（比如时长、音量等）可以被读取或设置。其中的 DOM 事件能够通知您，比方说，<video> 元素开始播放、已暂停，已停止，等等。

下例中简单的方法，向我们演示了如何使用 <video> 元素，读取并设置属性，以及如何调用方法。

### 实例

为视频创建简单的播放/暂停以及调整尺寸控件：

Your browser does not support HTML5 video.

上面的例子调用了两个方法：play() 和 pause()。它同时使用了两个属性：paused 和 width。

亲自试一试

## HTML5 <video> - 方法、属性以及事件

下面列出了大多数浏览器支持的视频方法、属性和事件：

方法 | 属性 | 事件
--- | --- | ---
play() | currentSrc | play
pause() | currentTime | pause
load() | videoWidth | progress
canPlayType | videoHeight | error
| duration | timeupdate
| ended | ended
| error | abort
| paused | empty
| muted | emptied
| seeking | waiting
| volume | loadedmetadata
| height |
| width |

注释：在所有属性中，只有 videoWidth 和 videoHeight 属性是立即可用的。在视频的元数据已加载后，其他属性才可用。

- HTML5 视频
- HTML5 音频