HTML5音訊audio播放形式
阿新 • • 發佈：2018-11-19
直到現在，仍然不存在一項旨在網頁上播放音訊的標準。
目前，大多數音訊是通過外掛（比如 Flash）來播放的。然而，並非所有瀏覽器都擁有同樣的外掛。
HTML5 規定了一種通過 audio 元素來包含音訊的標準方法。
audio 元素能夠播放聲音檔案或者音訊流。
當前，audio 元素支援三種音訊格式：
| IE 9 | Firefox 3.5 | Opera 10.5 | Chrome 3.0 | Safari 3.0 | |
|---|---|---|---|---|---|
| Ogg Vorbis | √ | √ | √ | ||
| MP3 | √ | √ | √ | ||
| Wav | √ | √ | √ |
開發例子原始碼如下：
<!DOCTYPE HTML> <html> <body> Internet Explorer 8 不支援 audio 元素。在 IE 9 中，對 audio 元素的支援。 <audio controls="controls" autoplay="autoplay"> <source src="http://www.w3school.com.cn/i/song.ogg" type="audio/ogg"> <source src="http://www.w3school.com.cn/i/song.mp3" type="audio/mpeg"> 你的瀏覽器不支援html5的audio標籤 </audio> </body> </html>
解釋：
1、control 屬性供新增播放、暫停和音量控制元件。
2、<audio> 與 </audio> 之間插入的內容是供不支援 audio 元素的瀏覽器顯示的。
3、audio 元素允許多個 source 元素。source 元素可以連結不同的視訊檔案。瀏覽器將使用第一個可識別的格式
支援的部分屬性列舉：
4、autoplay 是否自動播放。
| 屬性 | 值 | 描述 |
|---|---|---|
| autoplay | autoplay | 如果出現該屬性，則音訊在就緒後馬上播放。 |
| controls |
controls | 如果出現該屬性，則向用戶顯示控制元件，比如播放按鈕。 |
| loop | loop | 如果出現該屬性，則每當音訊結束時重新開始播放。 |
| preload | preload | 如果出現該屬性，則音訊在頁面載入時進行載入，並預備播放。 如果使用 "autoplay"，則忽略該屬性。 |
| src | url | 要播放的音訊的 URL。 |