HTML5 <video> - 使用 DOM 進行控制
HTML5 <video> 元素同樣擁有方法、屬性和事件。
其中的方法用于播放、暫停以及加載等。其中的屬性(比如時長、音量等)可以被讀取或設置。其中的 DOM 事件能夠通知您,比方說,<video> 元素開始播放、已暫停,已停止,等等。
下例中簡單的方法,向我們演示了如何使用 <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 屬性是立即可用的。在視頻的元數據已加載后,其他屬性才可用。