audio是HTML5引進的新元素。在文檔中表示音頻內容,此便簽的引入使得網頁播放音樂變得簡單。
audio使用起來相當的簡單:
<audio></audio>
此元素有如下幾個常用屬性
- src(音頻的地址)
- autoplay(自動播放)
- controls(是否顯示控制面板)
- loop(循環播放)
- volume(音量,值:0-1)
代碼
在index.html中加入如下代碼就可實現最基本的音樂播放功能。
<audio src="XXX" autoplay controls loop></audio>
送一個測試用的src:
src="http://mr3.doubanio.com/fb36b2b75e5b369e637ab01674816df5/0/fm/song/p1947687_128k.mp4"
JavsScripts渲染
也可以使用JavsScripts渲染出來:
(function() {
$audio = document.createElement('audio');
$audio.loop = true;
$audio.autoplay = true;
$audio.controls = true;
document.body.appendChild($audio);
$audio.src = `XXX`;
})()