H5中的标签(<audio…/> 和 <video…/>)对于JS中的HTMLAudioElement对象和HTMLVideoElement对象
对象有以下几个方法:
play(): 播放
pause(): 暂停播放
load(): 重新装载音频、视频
canPlayType(type): 判断该元素可播放type类型的音频、视频
下面是一个简单的音乐播放器
<title>音乐播放器</title>
</head>
<body><h2> 音乐播放器 </h2><select id='typeSel' style='width:160px'><option value='sequence'>顺序播放</option><option value='random'>随机播放</option></select><br /><audio id='player' controls>您的浏览器不支持audio元素</audio><script type="text/javascript">var musics = ["demo1.ogg","bomb.ogg","arrow.ogg","love.ogg","song.ogg",];var index = 0;var palyType;window.onload = function(){var typeSel = document.getElementById('typeSel');typeSel.onchange = function(){window.playType = typeSel.value;}var player = document.getElementById('player');player.src = musics[index];player.onended = function (){if(playType == 'random'){index = Math.floor(Math.random() * musics.length);palyer.src = musics[index];}else{player.src= musics[++index %musics.length];}player.play();}}</script> </body>
</html>
参考《疯狂HTML5 + CSS3 + JavaScript讲义》(第2版) P141~P142
