The onloadedmetadata event in HTML occurs when metadata is loaded for the specified audio/video. Events that occur during the loading process of an audio/video:
- onloadstart
- ondurationchange
- onloadedmetadata
- onloadeddata
- onprogress
- oncanplay
- oncanplaythrough
Syntax:
- In HTML:
<element onloadedmetadata="myScript">
- In JavaScript:
object.onloadedmetadata = function(){myScript};
- In JavaScript, using the addEventListener() method:
object.addEventListener("loadedmetadata", myScript);
Example: In JavaScript, using the addEventListener() method
HTML
<!DOCTYPE html> < html >
< head >
< title >
HTML DOM onloadeddata Event
</ title >
</ head >
< body >
< center >
< h1 style = "color:green" >
GeeksforGeeks
</ h1 >
< h2 >
HTML DOM onloadedmetadata Event
</ h2 >
< video controls id = "VideoId" >
< source src =
type = "video/mp4" >
</ video >
< script >
document.getElementById(
"VideoId").addEventListener(
"loadedmetadata", GFGFun);
function GFGFun() {
alert("Metadata loaded");
}
</ script >
</ center >
</ body >
</ html >
|
Output:
Supported Browsers: The browsers supported by HTML DOM onloadedmetadata Event are listed below:
- Google Chrome 3
- Edge 12
- Internet Explorer 9
- Firefox 3.5
- Apple Safari 3.1
- Opera 10.5