如何在網頁中應用HTML 5音頻
作者：佚名
世界上公認的第一個網頁是誕生于1992年，發展至今，網頁已經有21年歷史了。在這21年里面，網頁開發的標準從沒有完全統一過。而我們經常見到的web音頻就是這么樣子的。現在，大部分的網頁音頻播放依靠著flash，但是顯然地，flash已經越來越不適用于web開發。所以呢，蘋果放棄了flash，而Android也宣布不再支持flash。主要原因就是HTML5的誕生，為web開發提供了更加便捷、高效的音頻應用。那么，在網頁中HTML5音頻或者說HTML5播放器是怎么應用的呢。
HTML5 audio
在HTML5標準網頁里面，我們可以運用audio標簽來完成我們對聲音的調用及播放。以下是最經常見到的運用HTML5三種基本格式：
1.最少的代碼
- <audio src="song.ogg" controls="controls"></audio>
2.帶有不兼容提醒的代碼
- <audio src="song.ogg" controls="controls">
- Your browser does not support the audio tag.
- </audio>
3.盡量兼容瀏覽器的寫法
- <audio controls="controls">
- <source src="song.ogg" type="audio/ogg">
- <source src="song.mp3" type="audio/mpeg">
- Your browser does not support the audio tag.
- </audio>
HTML5音頻格式
當前，HTML***udio標簽支持三種格式的音頻，分別是wav mp3和ogg格式。而目前主流瀏覽器對他們的支持如下：
| IE 9 | Firefox 3.5 | Opera 10.5 | Chrome 3.0 | Safari 3.0 | |
|---|---|---|---|---|---|
| Ogg Vorbis | √ | √ | √ | ||
| MP3 | √ | √ | √ | ||
| Wav | √ | √ | √ |
IE8以及IE8以下不支持HTML5的audio標簽
HTML ***udio屬性
1.autoplay:***可選值為autoplay，出現autoplay屬性并準確賦值時，音頻將會自動播放
2.controls：***可選值為controls，出現controls屬性并準確賦值時，音頻播放控件將會顯示，控件包括：播放、暫停、定位、音量、全屏切換、字幕（如果可用）、音軌（如果可用）。
3.loop：***可選值為loop，出現loop屬性并準確賦值時，音頻將會循環播放。
4.preload：可選值有auto(當頁面加載后載入整個音頻)、meta(當頁面加載后只載入元數據)和none(當頁面加載后不載入音頻) 如果設置了前面的autoplay屬性，那么preload將會被忽略。
5.src：指定音頻URL地址，可以是相對的URL也可以是絕對的URL 當然還可以像第2和第3個例子一樣，用source標簽來指定源。
原文鏈接：http://www.itluren.com/apply-html5-audio-to-web.html
【編輯推薦】
責任編輯：彭凡
來源：
IT路人
