Descripción
El elemento HTMLMediaElement del HTML DOM API es una interfaz que proporciona los métodos y propiedades necesarios para controlar la reproducción de elementos multimedia como audio y video. Esta interfaz es heredada por los elementos HTMLAudioElement y HTMLVideoElement. Mediante HTMLMediaElement podemos reproducir, pausar, cargar y controlar todo tipo de contenido multimedia en una página web.
Sintaxis
HTMLMediaElement
Constructores
- N/A
Propiedades
- audioTracks
- autoplay
- buffered
- controls
- controlsList
- crossOrigin
- currentSrc
- currentTime
- defaultMuted
- defaultPlaybackRate
- disableRemotePlayback
- duration
- ended
- error
- loop
- mediaKeys
- muted
- networkState
- paused
- playbackRate
- played
- preload
- preservesPitch
- readyState
- remote
- seekable
- seeking
- sinkId
- src
- srcObject
- textTracks
- videoTracks
- volume
Métodos
- addTextTrack()
- captureStream()
- canPlayType()
- fastSeek()
- load()
- pause()
- play()
- seekToNextFrame()
- setMediaKeys()
- setSinkId()
Eventos
- abort
- canplay
- canplaythrough
- durationchange
- emptied
- encrypted
- ended
- error
- loadeddata
- loadedmetadata
- loadstart
- pause
- play
- playing
- progress
- ratechange
- seeked
- seeking
- stalled
- suspend
- timeupdate
- volumechange
- waiting
- waitingforkey
Ejemplo
Un ejemplo de uso del elemento HTMLMediaElement sería la creación de un reproductor de audio personalizado:
// Crear una instancia de audio
const audio = new Audio('music.mp3');
// Configurar propiedades
audio.volume = 0.5;
audio.loop = true;
// Añadir controles de reproducción
playButton.addEventListener('click', () => {
if (audio.paused) {
audio.play();
} else {
audio.pause();
}
});
// Escuchar eventos
audio.addEventListener('ended', () => {
console.log('La reproducción ha terminado');
});