JavaScript高级 面向对象（2）--调试工具的使用：音乐循环播放

说明（2017.3.29）：

1. 在调试工具console里输入var v = document.createElement("audio")，然后再source的watch里输入v回车，就能看到audio的所有事件，本次使用的是onended事件。

2. json不能直接遍历获得索引，只能通过for循环获取个数，再用for循环遍历。所以最好用数组存放歌名。

 <!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <title>Document</title>
 </head>
 <body>
     <audio id="music" src="Taylor Swift - Love Story.mp3" controls="controls" autoplay="autoplay">浏览器不支持</audio>

 </body>
 <script type="text/javascript">
     var songs = {
         1:"Taylor Swift - Love Story.mp3",
         2:"unity.mp3",
         3:"alone.mp3",
         4:"chinese-supermarkets-stop-selling-brazilian-meat-over-food-safety-scandal.mp3"
     };
     // var music = document.getElementById("music");
     // var num = (function(){
     //     var num = 0;
     //     for(var i in songs){
     //         num ++
     //     }
     //     return num;
     // })();
     // var i = 1;
     // setInterval(function(){
     //     if(i < num){
     //         if(music.ended){
     //             music.src = songs[i+1];
     //             i++;
     //         }
     //     }else{
     //         i = 0;
     //     }

     // },1000);

     var num = (function(){
         var num = 0;
         for(var i in songs){
             num ++
         }
         return num;
     })();
     var i = 1;
     music.onended = function(){
         if(i < num){
             music.src = songs[i+1];
             i++;
         }else{
             i = 0;
             music.src = songs[i+1];
             i++;
         }
     };

 </script>
 </html>