在JavaScript脚本中获取<audio.../>元素对应的对象为HTMLAudioElement对象，<video.../>元素对应的对象为HTMLVideoElement对象。
HTMLAudioElement对象和HTMLVideoElement对象支持的方法有如下几个：
- play()：播放视频、音频
- pause()：暂停播放
- load()：重新装载音频、视频文件
- canPlayType(type)：判断该元素是否可以播放type类型的音频、视频。该属性指定该音频、视频文件的类型，该属性值既可以是简单的MIME类型，例如audio/ogg、audio/mpeg等，也可以是MIME字符串并带codecs属性，codecs属性用于指定该视频文件的编码格式。该方法可以返回如下3个值
- probably：该浏览器支持播放此种类型的音频、视频
- maybe：该浏览器可能支持播放此种类型的音频、视频
- 空字符串：该浏览器不支持播放此种类型的音频、视频
下面页面代码实现了一个简单的音乐播放器，支持两种播放模式：随机播放和顺序播放。
<!DOCTYPE html> <html> <head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org)" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title> 音乐播放器 </title> <script type="text/javascript"> // 定义能播放的所有音乐 var musics = [ "demo1.ogg", "bomb.ogg", "arrow.ogg", "love.ogg", "song.ogg", ]; // 定义正在播放的音频文件的索引 var index = 0; // 记录顺序播放、随机播放的变量 var playType; var player; window.onload = function() { var typeSel = document.getElementById("typeSel"); // 当用户更改下拉菜单的选项时，改变播放方式 typeSel.onchange = function() { window.playType = typeSel.value; } player = document.getElementById("player"); // 页面加载时播放第一个音频文件 player.src = musics[index]; player.onended = function() { if(playType == "random") { // 计算一个随机数 index = Math.floor(Math.random() * musics.length); // 随机播放一个音频文件 player.src = musics[index]; } else { // 播放下一个音频文件 player.src = musics[++index % musics.length]; } // 播放 player.play(); } } </script> </head> <body> <h2> 音乐播放器 </h2> <select id="typeSel" style="160px"> <option value="sequence">顺序播放</option> <option value="random">随机播放</option> </select><br/> <audio id="player" controls> 您的浏览器不支持audio元素 </audio> </body> </html>
页面效果如下：
