最新的Web開發教程

HTML5音頻


HTML5提供用於播放音頻文件的標準。

HTML5音頻是HTML5說明書的主題,引入音頻輸入,回放,和合成,以及語音到文本中,在瀏覽器中。


音頻在網絡上

HTML5之前,有播放網頁上的音頻文件還沒有標準。

HTML5之前,音頻文件只能有一個插件發揮(like flash)

HTML5的<audio>元素指定的標準方式嵌入音頻中的網頁。


瀏覽器支持

在表中的數字指定完全支持所述第一瀏覽器版本<audio>元素。

元件
<audio> 4 9 3.5 4 10.5

的HTML <audio>

在HTML中播放音頻文件,使用<audio>元素:

<audio controls>
  <source src="horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
試一試»

在<audio>元素表示聲音或音頻流。 它通常用於在網頁中播放單一的音頻文件,顯示與播放/暫停/音量控制GUI窗口小部件。

在<audio>元素具有以下屬性:

全局屬性(ACCESSKEY;類; CONTENTEDITABLE;文本菜單; DIR;拖動;懸浮窗;隱藏; ID;郎;拼寫檢查;風格; tabindex屬性;稱號;翻譯)

自動播放=“自動播放”或“”(空字符串)或空指示用戶代理到只要它可以這樣做,在不停止自動開始所述音頻流的回放。

預緊=“none”或“元數據”或“自動”或“”(空字符串)或空表示一個與音頻流本身或元數據的樂觀下載是否被認為是值得提示的用戶代理。

“無”:提示所述用戶代理,用戶預期不會需要的音頻流,或最大限度地減少不必要的通信量是理想的。

“元數據”:提示所述用戶代理,用戶預期不會需要的音頻流,但是獲取其元數據(持續時間等)是理想的。

“自動”:提示到的User-Agent樂觀下載整個音頻流被認為是可取的。

對照=“對照”或“”(空字符串)或空指示用戶代理,以暴露一個用戶接口,用於控制所述音頻流的回放。

環路=“循環”或“”(空字符串)或空指示用戶代理在到達端尋求回音頻流的開始。 MEDIAGROUP =串指示用戶代理向多個視頻和/或音頻流連接在一起。

靜音=“靜音”或“”(空字符串)或空表示音頻流的默認狀態,潛在地覆蓋用戶偏好。 SRC =非空[URL]潛在地由包圍空間的音頻流的URL。


HTML音頻 - 它如何工作

controls的屬性增加了音響控制,如播放,暫停和音量。

之間文本<audio></audio>標籤將在不支持的瀏覽器中顯示<audio>元素。

多個<source>元件可以鏈接到不同的音頻文件。 瀏覽器將使用第一個可識別的格式。


HTML音頻 - 瀏覽器支持

目前,有3支持的文件格式為<audio>元素:MP3,WAV,和Ogg:

瀏覽器 MP3 WAV 奧格
Internet Explorer YES NO NO
Chrome YES YES YES
Firefox YES YES YES
Safari YES YES NO
Opera YES YES YES

HTML音頻 - 媒體類型

文件格式 媒體類型
MP3 audio/mpeg
Ogg audio/ogg
Wav audio/wav

HTML音頻 - 方法,屬性和事件

HTML5定義了DOM的方法,屬性和事件<audio>元素。

這使您可以加載,播放,暫停和音頻,以及設定時間段和體積。

也有DOM事件時,音頻開始播放,可以通知你,暫停等。

對於一個完整的DOM參考,請訪問我們的HTML5音頻/視頻DOM參考


HTML5音頻標籤

標籤 描述
<audio> 定義聲音內容
<source> 定義了用於媒體元素的多個媒體資源,諸如<video><audio>

HTML音頻 - 網絡語音API

網絡語音API旨在為Web應用程序的替代輸入法(不使用鍵盤)。 有了這個API,開發者可以給網絡應用程序轉錄語音至文本,從計算機的麥克風的能力。 錄製的音頻發送到轉錄語音服務器,在此之後,文本輸入了用戶。 API本身是不可知的底層語音識別實現的,並且可以支持基於這兩種服務器以及嵌入式識別。 該HTML講話孵化組提出的音頻的語音技術實現在瀏覽器中統一的,跨平台的API的形式。 該API包含兩種:

  • 語音輸入API
  • 文本到語音API