home
play_circle_filled
menu
cached
settings_brightness
Run
×
Change Orientation
Change Theme, Dark/Light
<!DOCTYPE html> <html> <head> <title>HTML onloadstart attribute example</title> <meta charset="utf-8" /> </head> <body> <h3>HTML onloadstart attribute example</h3> <div class="example"> <video controls id="myvideoid" width="250"> <source src="source-video-path.mp4" type="video/mp4"> </video> </div> <div class="event-log"> Event log:<p readonly id="eventLog"></p> </div> <script> const video = document.querySelector("video"); const eventLog = document.querySelector("#eventLog"); function handleEvent(event) { eventLog.innerHTML += event.type + "<br>"; } video.addEventListener("loadeddata", handleEvent); video.addEventListener("loadedmetadata", handleEvent); video.addEventListener("durationchange", handleEvent); video.addEventListener("progress", handleEvent); video.addEventListener("loadstart", handleEvent); video.addEventListener("canplay", handleEvent); video.addEventListener("canplaythrough", handleEvent); </script> <p>Note: If you set src correctly, the handler will generate a response.</p> </body> </html>