English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
After we insert these audio and video tags into the page, we find that there are no audio files on the page, and the video files cannot be played. What is the reason for this? This is because we are missing some media elements. Below is a list of some media elements
HTML5 DOM provides methods, properties, and events for <audio> and <video> elements.
These methods, properties, and events allow you to use JavaScript to manipulate <audio> and <video> elements.
method | Description |
addTextTrack() | to the audio/video adds a new text track. |
canPlayType() | check if the browser can play the specified audio/video type. |
load() | reload the audio/video element. |
play() | start playing audio/video |
pause() | pause the currently playing audio/video |
property | Description |
audioTracks | Returns an AudioTrackList object representing the available audio tracks. |
autoplay | Sets or returns whether the audio should be played immediately after loading is complete./video |
buffered | Returns the audio/The TimeRanges object representing the parts of the video that have been buffered. |
controller | Returns the audio/The MediaController object representing the current media controller of the video. |
controls | Sets or returns the audio/Whether the video controls are displayed (such as play/(such as pause, etc.). |
crossOrigin | Sets or returns the audio/The CORS settings of the video. |
currentSrc | Returns the current audio/The URL of the video. |
currentTime | Sets or returns the audio/The current playback position in the video (in seconds). |
defaultMuted | Sets or returns the audio/Whether the video is muted by default. |
defaultPlaybackRate | Sets or returns the audio/The default playback speed of the video. |
duration | Returns the current audio/The length of the video (in seconds). |
ended | Returns the audio/Whether the playback of the video has ended. |
error | Returns the audio/The MediaError object representing the video error state. |
loop | Sets or returns the audio/Whether the video should be replayed at the end. |
mediaGroup | Sets or returns the audio/The group to which the video belongs (used to connect multiple audio/The video element). |
muted | Sets or returns the audio/Whether the video is muted. |
networkState | Returns the audio/The current network state of the video. |
paused | Sets or returns the audio/Whether the video is paused. |
playbackRate | Sets or returns the audio/The playback speed of the video. |
played | Returns the audio/The TimeRanges object representing the parts of the video that have been played. |
preload | Sets or returns the audio/Whether the video should be loaded after the page is loaded. |
readyState | Returns the audio/The current ready state of the video. |
seekable | Returns the audio/The TimeRanges object representing the addressable parts of the video. |
seeking | Returns whether the user is currently on audio/Search within the video. |
src | Sets or returns the audio/The current source of the video element. |
startDate | Returns the Date object representing the current time offset. |
textTracks | Returns the TextTrackList object representing the available text tracks. |
videoTracks | Returns the VideoTrackList object representing the available video tracks. |
volume | Sets or returns the audio/The volume of the video. |
Event | Description |
abort | When the audio/Triggered when the loading of the video has been aborted. |
canplay | Triggered when the browser can start playing audio./video |
canplaythrough | Triggered when the browser can play without stopping due to buffering. |
durationchange | When the audio/Triggered when the duration of the video has changed. |
emptied | Triggered when the current playlist is empty. |
ended | Triggered when the current playlist has ended. |
error | When in the audio/Triggered when an error occurs during the video loading. |
loadeddata | When the browser has loaded audio/Triggered when the current frame of the video is loaded. |
loadedmetadata | When the browser has loaded audio/Triggered when the metadata of the video is loaded. |
loadstart | Triggered when the browser starts to search for audio/video |
pause | When the audio/Triggered when the video has paused. |
play | When the audio/Triggered when the video has started or is no longer paused. |
playing | When the audio/Triggered when the video is ready after pausing or stopping due to buffering. |
progress | Triggered when the browser is downloading audio/video |
ratechange | When the audio/Triggered when the video playback speed has changed. |
seeked | Triggered when the user has moved/Jump to audio/Triggered when a new position in the video is reached. |
seeking | Triggered when the user starts to move/Jump to audio/Triggered when a new position in the video is reached. |
stalled | Triggered when the browser tries to fetch media data but the data is not available. |
suspend | Triggered when the browser deliberately does not fetch media data. |
timeupdate | Triggered when the current playback position has changed. |
volumechange | Triggered when the volume has changed. |
waiting | Triggered when the video stops due to the need to buffer the next frame. |