HTML5中audio標籤的使用
HTML5中的新元素標籤
src:音訊檔案路徑。
autobuffer:設定是否在頁面載入時自動緩衝音訊。
autoplay:設定音訊是否自動播放。
loop:設定音訊是否要迴圈播放。
controls:屬性供新增播放、暫停和音量控制元件。
這些屬性和<video>元素標籤的屬性很類似
如何工作:
<audio src="song.mp3"></audio>
同樣<audio></audio> 之間插入的內容是供不支援 audio 元素的瀏覽器顯示的:
<audio src="song.ogg" controls="controls">Your browser does not support the audio tag.</audio>
常用的控制函式:
1.load():載入音訊、視訊軟體
2.play():載入並播放音訊、視訊檔案或重新播放暫停的的音訊、視訊
3.pause():暫停出於播放狀態的音訊、視訊檔案
4.canPlayType(obj):測試是否支援給定的Mini型別的檔案
可指令碼控制的屬性值:
1.autoplay:自動播放已經載入的的媒體檔案
2.loop為true:的時候則設定為自動播放
3.currentTime:以s為單位返回從開始播放到目前所花的時間
4.controls:顯示或者隱藏使用者控制介面
5.volume:音量值,從0.0至1.0之間
6.muted:設定是否靜音
7.autobuffer:是否進行緩衝載入
Audio 物件屬性
屬性 描述
audioTracks 返回表示可用音訊軌道的 AudioTrackList 物件。
autoplay 設定或返回是否在就緒(載入完成)後隨即播放音訊。
buffered 返回表示音訊已緩衝部分的 TimeRanges 物件。
controller 返回表示音訊當前媒體控制器的 MediaController 物件。
controls 設定或返回音訊是否應該顯示控制元件(比如播放/暫停等)。
crossOrigin 設定或返回音訊的 CORS 設定。
currentSrc 返回當前音訊的 URL。
currentTime 設定或返回音訊中的當前播放位置(以秒計)。
defaultMuted 設定或返回音訊預設是否靜音。
defaultPlaybackRate 設定或返回音訊的預設播放速度。
duration 返回音訊的長度(以秒計)。
ended 返回音訊的播放是否已結束。
error 返回表示音訊錯誤狀態的 MediaError 物件。
loop 設定或返回音訊是否應在結束時再次播放。
mediaGroup 設定或返回音訊所屬媒介組合的名稱。
muted 設定或返回是否關閉聲音。
networkState 返回音訊的當前網路狀態。
paused 設定或返回音訊是否暫停。
playbackRate 設定或返回音訊播放的速度。
played 返回表示音訊已播放部分的 TimeRanges 物件。
preload 設定或返回音訊的 preload 屬性的值。
readyState 返回音訊當前的就緒狀態。
seekable 返回表示音訊可定址部分的 TimeRanges 物件。
seeking 返回使用者當前是否正在音訊中進行查詢。
src 設定或返回音訊的 src 屬性的值。
textTracks 返回表示可用文字軌道的 TextTrackList 物件。
volume 設定或返回音訊的音量。
Audio 物件方法
方法 描述
addTextTrack() 向音訊新增新的文字軌道。
canPlayType() 檢查瀏覽器是否能夠播放指定的音訊型別。
fastSeek() 在音訊播放器中指定播放時間。
getStartDate() 返回新的 Date 物件,表示當前時間線偏移量。
load() 重新載入音訊元素。
play() 開始播放音訊。
pause() 暫停當前播放的音訊。
相關文章
- HTML5 audio標籤使用js進行播放控制例項HTMLJS
- html5標籤HTML
- HTML5的新特性——語義化標籤、多媒體標籤(video、audio)、input型別、表單屬性HTMLIDE型別
- HTML5的canvas標籤HTMLCanvas
- HTML中的標籤的使用HTML
- HTML5新標籤或改動標籤HTML
- Jstl中標籤的使用JS
- HTML5中關於標籤的那些事兒HTML
- HTML5中Audio使用踩坑彙總HTML
- HTML5常用標籤HTML
- HTML5 標籤列表HTML
- HTML5 新增標籤HTML
- HTML5 新標籤HTML
- HTML標籤(基本標籤的使用)HTML
- java <%!%>標籤和<%%>標籤的使用Java
- Jsp中param標籤的使用JS
- HTML5 標籤歸納HTML
- HTML5新標籤相容——>HTML
- html5~標籤新特性HTML
- html5標籤知多少HTML
- html5基本常用標籤HTML
- 【HTML5】開發之meta標籤的viewport使用說明HTMLView
- HTML5 之語義標籤HTML
- HTML5標籤embed詳解HTML
- html5文字標籤HTML
- HTML 標籤的使用HTML
- Golang中struct結構標籤(Tag)的使用GolangStruct
- jsp中c標籤的詳細使用JS
- html中a標籤中的onclick和href的使用--轉載HTML
- Html5 aside標籤的用法和作用HTMLIDE
- HTML5新新增的語義化標籤HTML
- 記HTML5 <a> 標籤的一個小坑HTML
- W3school的Html5新標籤HTML
- HTML5常見標籤詳解HTML
- html5新增及刪除標籤HTML
- HTML常用標籤的使用HTML
- s:iterator標籤的使用
- html標籤使用HTML