js简易版歌单播放，可切换下一首_js audio切换歌曲-CSDN博客

本文链接：https://blog.csdn.net/weixin_57607714/article/details/119844836

可暂停可点击切换上一首下一首同时变动歌曲名字

新手小白版还没有实现列表功能

如果需要兼容所有浏览器在<audio> 元素中使用 <source> 元素 <source> 元素可以链接到不同的音频文件浏览器将使用第一个可识别的音频文件格式

<body>
    <audio controls>
        <source id="sour" src="http://m801.music.126.net/20210821210705/83da1af2609b4acc027dbce2ca7ba4c5/jdyyaac/obj/       w5rDlsOJwrLDjj7CmsOj/10421880906/7365/6e5b/357a/2ecc4d916b236ad2e27e30650e0c373c.m4a" type="audio/ogg">
        </source>
    </audio>
    <br>
    <button id="prev">上一首</button>
    <button id="next">下一首</button>
    <p id="p">歌名</p>

    <script>
        var prev = document.getElementById('prev');
        var audio = document.querySelector('audio');
        var next = document.getElementById('next');
        var p = document.getElementById('p');
        // var sour = document.getElementById('sour');
        next.onclick = function() {
            audio.src = 'http://m801.music.126.net/20210821210000/81f40903a15983f99f7be77b30cdd2a3/jdyyaac/obj/w5rDlsOJwrLDjj7CmsOj/8915433530/49d0/0045/8c4c/8506b4bec58cf3e5dcf0a2a0d6828ac4.m4a';
            p.innerHTML = '楼顶上的小斑鸠';
        }
        prev.onclick = function() {
            audio.src = 'http://m801.music.126.net/20210821210705/83da1af2609b4acc027dbce2ca7ba4c5/jdyyaac/obj/w5rDlsOJwrLDjj7CmsOj/10421880906/7365/6e5b/357a/2ecc4d916b236ad2e27e30650e0c373c.m4a';
            p.innerHTML = '全名';

        }
    </script>
</body>