胡小哥课堂笔记
整理了下昨天学习的H5的一个新东东，做了一个很简易的音频播放器。
HTML5 提供了播放音频文件的标准。
音频元素：<audio>
controls ：为视频提供播放控件
autoplay :自动播放
通过使用HTML5中的audio功能，我们可以实现与flash相同的功能，即循环，随机，跳转等功能。
如下图：
<body>
<audio id=ad controls autoplay="autoplay">
<source src="sources/aaa.mp3" type="audio/mp3"></source>
浏览器不支持audio元素。
</audio>
<select id="sele">
<option value="顺序播放">顺序播放</option>
<option value="随机播放">随机播放</option>
</select>
<script type="text/javascript">
var arr = ["sources/aaa.mp3","sources/bbb.mp3","sources/ccc.mp3"]//申明一个数组将音频路径放进去
var playtype;//播放状态
var index = 0;//下标
window.onload = function(){//页面加载完成后执行事件
var sele = document.getElementById("sele");//获取节点对象
sele.onchange = function(){//事件会在域的内容改变时执行
playtype=sele.value;//获取播放状态
};
var ad = document.getElementById("ad");//获取播放器对象
ad.src=arr[index];//音频路径等于arr下标索引的值
ad.onended = function(){//当音频播放结束时执行
//随机播放
if (playtype=="随机播放") {//判断状态是否等于"随机播放"
index=Math.floor(Math.random()*arr.length);//下标值等于随机数*arr数组的长度
ad.src=arr[index];//音频播放路径等于arr数组里的下标的值
}
//顺序播放
else{
index++;//每次下标+1
ad.src=arr[index];//音频路径等于arr下标索引的值
if (index==arr.length-1) {//当下标大于数组空间长度时
index=-1;//下标-1
}
}
ad.play();//音频播放
};
};
</script>
</body>
——来自胡小哥课堂笔记