html音乐播放器 musicPlayer

html音乐播放器 音乐播放器 播放歌曲 支持播放暂停 上一首 下一首切换 支持显示歌曲列表 点击切换歌曲功能

苦于版权原因 可以下载歌曲到本地 通过本项目在线创建自己的歌单实现网页播放和控制

1 歌单上传 歌曲复制到music文件夹 2播放 3 html播放样式 添加列表下拉 音量控制 4 点击选择歌曲播放

主要使用html JavaScript css

下面的功能是获取歌单把歌单名字显示在页面
    var musicUrls=['music/别说我的眼泪你无所谓.mp3','music/听悲伤的情歌 - 什么琪.mp3','music/兄弟抱一下-丁呱呱.mp3','music/真情永不变-花姐.mp3'];// 歌曲mp3数组
    var musicNameData = []; 
    for (var i = 0; i < musicUrls.length; i++) {
      var urlParts = musicUrls[i].split('/');
      var filename = urlParts[urlParts.length - 1];
      var musicNames = filename.split('.')[0];
      musicNameData.push(musicNames);
    } 
    console.log(musicNameData);  
    // 获取要插入的UL元素
    const ul = document.getElementById('myList');
    // 遍历数组
    musicNameData.forEach(function(item) {
      // 创建一个新的LI元素
      const li = document.createElement('li'); 
      // 将数组元素赋值给LI元素的文本内容
      li.textContent = item;
      // 获取要插入的UL元素 
      // 将LI元素添加到UL列表中
      ul.appendChild(li);
    });

html音乐播放器

项目获取：

项目获取：typora: typora/img (gitee.com)

备用项目获取链接1：yifeiyixiang/kamo: 源码下载 (github.com)

备用项目获取链接2： 卡莫_ / Kamo · GitCode