纯html音乐播放器

当你打开该 HTML 文件时,会自动触发 window.onload 事件,并调用 playRandomSong 函数播放随机歌曲。播放器会自动选择一个歌曲进行播放,在播放完一首歌曲后自动随机选择另一首歌曲继续播放

<!DOCTYPE html>
 
<html>
 
<head>
 
    <title>音乐播放器</title>
 
    <script>
 
        window.onload = function() {
 
            var audio = document.getElementById("audioPlayer");
 
            audio.addEventListener('ended', playRandomSong);
 
            playRandomSong();
 
        };
 
 
 
        function playRandomSong() {
 
            var songs = [
 
               //这里填写音乐文件的URL,多个URL用换行符分割
 
            ];
 
 
 
            var randomIndex = Math.floor(Math.random() * songs.length);
 
            var audio = document.getElementById("audioPlayer");
 
            audio.src = songs[randomIndex];
 
            audio.play();
 
 
 
            var currentSongUrl = document.getElementById("currentSongUrl");
 
            currentSongUrl.textContent = "正在播放:" + songs[randomIndex];
 
        }
 
    </script>
 
</head>
 
<body>
 
    <h1 id="currentSongUrl"></h1>
 
    <audio id="audioPlayer" controls></audio>
 
</body>
 
</html>

猜你喜欢

转载自blog.csdn.net/q4717529/article/details/134008324