Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

เมธอด load() ของ Video ใน HTML DOM

เมธอด load() ของ HTML DOM Video ใช้สำหรับเรนเดอร์ใหม่ (re-render) องค์ประกอบวิดีโอหลังจากที่แอตทริบิวต์บางอย่างถูกอัปเดตโดยผู้ใช้ เช่น 'src'

ไวยากรณ์ (Syntax)

videoObject.load()

ตัวอย่างการใช้งาน

ตัวอย่างต่อไปนี้แสดงการใช้งานเมธอด Video load():

<!DOCTYPE html> <html> <head> <title>HTML DOM Video load()</title> <style>    * {       padding: 2px;       margin:5px;    }    form {       width:70%;       margin: 0 auto;       text-align: center;    }    input[type="button"] {       border-radius: 10px;    } </style> </head> <body>    <form>         <fieldset>          <legend>HTML-DOM-Video-load( )</legend>          <video id="demo" width="320" controls><source    src="https://www.tutorialspoint.com/html5/foo.mp4" type="video/mp4"></video><br>          <input type="button" onclick="getTrackDetails(1)" value="Slow (<<)">          <input type="button" onclick="getTrackDetails(2)" value="Fast (>>)">          <div id="divDisplay"></div>         </fieldset>    </form> <script>    var divDisplay = document.getElementById("divDisplay");    var demo = document.getElementById("demo");    function getTrackDetails(val) {       if(val === 1){          demo.defaultPlaybackRate -= 0.5;          demo.load();          divDisplay.textContent = 'Default Playback Set: '+demo.defaultPlaybackRate;       }       else{          demo.defaultPlaybackRate += 0.5;          demo.load();          divDisplay.textContent = 'Default Playback Set: '+demo.defaultPlaybackRate;       }    } </script> </body> </html>

ผลลัพธ์

คลิกปุ่ม 'Fast (>>)' 2 ครั้ง:

เมธอด load() ของ Video ใน HTML DOM

คลิกปุ่ม 'Slow (<<)':

เมธอด load() ของ Video ใน HTML DOM