HTML5 Audio & Video 屬性解析

Meils發表於2019-02-16
HTMLIDE

一、HTML 音訊/視訊 方法

play()

play() 方法開始播放當前的音訊或視訊。

var myVideo=document.getElementById("video1"); 

function playVid()
{ 
  myVideo.play(); 
} 
function pauseVid()
{ 
  myVideo.pause(); 
}

pause()

pause() 方法暫停播放當前的音訊或視訊。

var myVideo=document.getElementById("video1"); 

function playVid()
{ 
  myVideo.play(); 
} 
function pauseVid()
{ 
  myVideo.pause(); 
}

load()

load() 方法重新載入音訊/視訊（audio/video）元素。

load() 方法用於在更改來源或其他設定後對音訊/視訊（audio/video）元素進行更新。

<button onclick="changeSource()" type="button">更改視訊來源</button>
<br> 
<video id="video1" controls="controls" autoplay="autoplay">
  <source id="mp4_src" src="mov_bbb.mp4" type="video/mp4">
  <source id="ogg_src" src="mov_bbb.ogg" type="video/ogg">
  您的瀏覽器不支援 HTML5 video  標籤。
</video>

<script> 
function changeSource()
{ 
  document.getElementById("mp4_src").src="movie.mp4";
  document.getElementById("ogg_src").src="movie.ogg";
  document.getElementById("video1").load();
} 
</script>

canPlayType()

function supportType(e,vidType,codType)
{ 
  myVid=document.createElement(`video`);
  isSupp=myVid.canPlayType(vidType+`;codecs="`+codType+`"`);
  if (isSupp=="")
  {
    isSupp="No";
  }
  return isSupp;
}

二、HTML 音訊/視訊屬性

autoplay

【設定】或【返回】是否在載入完成後隨即播放音訊/視訊。

controls

【設定】或【返回】音訊/視訊是否顯示控制元件（比如播放/暫停等）。

currentTime

【設定】或【返回】音訊/視訊中的當前播放位置（以秒計）。

defaultMuted

【設定】或【返回】音訊/視訊預設是否靜音。

defaultPlaybackRate

【設定】或【返回】音訊/視訊的預設播放速度。

duration

【返回】當前音訊/視訊的長度（以秒計）。

ended

【返回】音訊/視訊的播放是否已結束

error

【返回】表示音訊/視訊錯誤狀態的 MediaError 物件。

loop

【設定】或【返回】音訊/視訊是否應在結束時重新播放。

muted

【設定】或【返回】音訊/視訊是否靜音。

paused

【設定】或【返回】音訊/視訊是否暫停。

playbackRate

【設定】或【返回】音訊/視訊播放的速度。

src

【設定】或【返回】音訊/視訊元素的當前來源。

volume

【設定】或【返回】音訊/視訊的音量。

二、HTML 音訊/視訊事件

canplay

當瀏覽器可以開始播放音訊/視訊時觸發。

ended

當目前的播放列表已結束時觸發。

error

當在音訊/視訊載入期間發生錯誤時觸發。

pause

當音訊/視訊已暫停時觸發。

play

當音訊/視訊已開始或不再暫停時觸發。

playing

當音訊/視訊在因緩衝而暫停或停止後已就緒時觸發。

progress

當瀏覽器正在下載音訊/視訊時觸發。

ratechange

當音訊/視訊的播放速度已更改時觸發。

seeked

當使用者已移動/跳躍到音訊/視訊中的新位置時觸發。

seeking

當使用者開始移動/跳躍到音訊/視訊中的新位置時觸發。

timeupdate

當目前的播放位置已更改時觸發。

volumechange

當音量已更改時觸發。

waiting

當視訊由於需要緩衝下一幀而停止時觸發。

當音訊/視訊處於載入過程中時，會依次發生以下事件：

loadstart
durationchange
loadedmetadata
loadeddata
progress
canplay
canplaythrough

相關文章