html播放音乐列表
时间: 2023-07-01 14:12:23 浏览: 67
你可以使用HTML5的<audio>标签来播放音乐,同时使用JavaScript来控制播放列表。以下是一个简单的例子:
HTML代码:
```
<audio id="player" controls>
<source src="song1.mp3" type="audio/mpeg">
</audio>
<ul id="playlist">
<li><a href="song1.mp3">Song 1</a></li>
<li><a href="song2.mp3">Song 2</a></li>
<li><a href="song3.mp3">Song 3</a></li>
</ul>
```
JavaScript代码:
```
var player = document.getElementById('player');
var playlist = document.getElementById('playlist');
var links = playlist.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) {
links[i].addEventListener('click', playSong);
}
function playSong(e) {
e.preventDefault();
var source = this.getAttribute('href');
player.src = source;
player.play();
}
```
这个例子创建了一个包含一个音乐播放器和一个播放列表的HTML页面。JavaScript代码将播放列表中的每个链接添加了一个事件监听器,当链接被点击时,播放器将播放链接指向的音乐文件。你可以根据你自己的需求修改这个例子来创建一个适合你的音乐播放列表。