具体的なコードは次のようになります：
<html lang=ja><head><meta charset=UTF-8><title>Documenttitle><style>figcaption {text-align: center;line-height: 150px;font-family: Microsoft Yahei;font-size: 24px;}.player {幅: 720px;高さ: 360px;margin: 10px auto;border: 1px 無地 #000;background-color: #000;位置: 相対;境界半径: 6px;}.player video {幅: 720px;高さ: 360px;}.controls {幅: 700px;高さ: 40px;背景色: rgba(255,255,0,0.3) ;位置: 絶対;下: 10 ピクセル;左: 10 ピクセル;境界半径: 10 ピクセル;}.switch {位置: 絶対;幅: 22 ピクセル;高さ: 22 ピクセル;背景色: 赤;左: 10 ピクセル;上: 9 ピクセル;境界半径: 50%;}.progress {幅: 432 ピクセル;高さ: 10 ピクセル;位置: 絶対;背景色: rgba(255,255,255,0.4);左: 40px;上: 15px;border-radius: 4px;overflow: hidden;}.curr-progress {width: 0%;height: 100%;background-color: #fff;}.time {width: 120px;height: 20px;text-align : センター;行の高さ: 20 ピクセル;フォント サイズ: 12 ピクセル;カラー: #fff;位置: 絶対;左: 510 ピクセル;上: 10px;}.extend {position: 絶対;width: 20px;height: 20px;background-color: red;right: 10px;top: 10px;}style>head><body><figure> <figcaption>ビデオ パターン例figcaption> <div class=player><video src=11.mp4>video><div class=controls><a href=# class=switch>a><div class=progress><div class=curr-progress>div>div><div class=time><span class=curr-time>00:00:00span>/<span class=total -time>00:00:00span>div><a href=# class=extend>a>div>div>figure><script>var video = document.querySelector('video');var playBtn = document.querySelector('.switch');var currProgress = document.querySelector('.curr-progress');var currTime = document.querySelector('.curr-time' );var totalTime = document.querySelector('.total-time');var extend = document.querySelector('.extend');var tTime = 0;playBtn.onclick = function() {if(video.paused){ // 結果ビデオが停止しているvideo.play(); //play()播放load()重新加ダウンロードpause()暂停止}else{video.pause();}}//当ビデオ能播放(已经通过网络加播完了)timevideo.oncanplay = function() {tTime =ビデオの長さ; //当ビデオ視聴時間長(单単位秒)var tTimeStr = getTimeStr(tTime);totalTime.innerHTML = tTimeStr;}//当ビデオ当前放送時間更新の時刻video.ontimeupdate = function() {var cTime = video.currentTime; //获取当前播放時間 var cTimeStr = getTimeStr(cTime);console.log(cTimeStr);currTime.innerHTML = cTimeStr;currProgress.style.width = cTime/tTime*100+%;}extend.onclick = function() { video.webkitRequestFullScreen(); //ビデオ全画面}//秒が単位の時間に変わります00:00:00形式の文字列function getTimeStr(time) {var h = Math.floor(time/3600);var m = Math.floor( time%3600/60);var s = Math.floor(time%60);h = h>=10?h:0+h;m = m>=10?m:0+m;s = s>=10?s:0+s;return h+:+m+:+s;}script>body >html>总结上記は、大家による小さな HTML5 ビデオ放送 (ビデオ)、JavaScript 制御ビデオのコードの例であり、大家に何か疑問がある場合は、大家に役立つことを願っています。こちらも非常に感谢大家对VeVb武林网网站のサポート！