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的新特性——語義化標籤、多媒體標籤(video、audio)、input型別、表單屬性HTMLIDE型別
- HTML5中Audio使用踩坑彙總HTML
- HTML5 新增標籤HTML
- HTML5常用標籤HTML
- HTML5 標籤列表HTML
- HTML中的標籤的使用HTML
- html5基本常用標籤HTML
- HTML5 標籤歸納HTML
- HTML5新標籤相容——>HTML
- HTML標籤(基本標籤的使用)HTML
- Html5 aside標籤的用法和作用HTMLIDE
- html5文字標籤HTML
- HTML5 之語義標籤HTML
- html5 audio整理HTML
- HTML5新新增的語義化標籤HTML
- HTML5常見標籤詳解HTML
- marquee 標籤的使用
- html標籤-HTML5精講 課時ID:6.1 【表嚴肅】#HTML教程 #HTML5教程 #html標籤HTML
- body標籤-HTML5精講 課時ID:6.2 【表嚴肅】#HTML教程 #HTML5教程 #body標籤HTML
- [譯] 可用但最不常見的 HTML5 標籤HTML
- Golang中struct結構標籤(Tag)的使用GolangStruct
- 關於qq音樂audio標籤裡src的獲取問題
- 第六課 Html5常用標籤 html5學習1HTML
- <base href=““/> 標籤的使用
- HTML常用標籤的使用HTML
- HTML5標籤HTMLCollection和NodeList的區別詳解HTML
- PbootCMS可使用的列表標籤內容tags標籤呼叫boot
- html標籤使用HTML
- 你有用過HTML5中的datalist標籤嗎?說說你對它的理解HTML
- JavaScript各類標籤的使用JavaScript
- HTML5 Audio(音訊)簡介HTML音訊
- 初識HTML5 Web Audio APIHTMLWebAPI
- HTML5 Audio & Video 屬性解析HTMLIDE
- HTML5 video audio 元素詳解HTMLIDE
- 淺析Bootstrap中Tab(標籤頁)的使用方法boot
- 好程式設計師web前端分享HTML5中的nav標籤學習筆記程式設計師Web前端HTML筆記
- pom中repositories標籤
- js--標籤語法的使用JS
- angular中使用a標籤的錨點Angular