Con jQuery possiamo leggere i dati dei video presenti in una pagina web.
I video HTML5, inseriti tramite l'elemento video
, dispongono di un API che ci permette di accedere non solo alle azioni più comuni
di questi elementi, ma anche ai metadati in essi contenuti. jQuery in tal senso è un comodo strumento per poterli gestire.
Supponiamo di voler leggere la proprietà duration
di un video. Istintivamente saremmo portati a scrivere il seguente codice:
var $video = $( "#movie" ),
video = $video[0]; // elemento DOM
console.log( video.duration ); // undefined
Perché il valore è undefined
? Il motivo è semplice: dobbiamo aspettare che i metadati del video siano accessibili sfruttando un evento
specifico, ossia l'evento loadedmetadata
:
$video.on( "loadedmetadata", function() {
console.log( this.duration ); // valore
});
Una volta compreso l'uso di questo evento risulta più semplice gestire i video HTML5.