音乐播放器代码 -播放器代码

制作一个简单的音乐播放器涉及到HTML、CSS和JavaScript的使用。以下是一个基本的示例,它创建了一个简单的音乐播放器,其中包含播放、暂停和停止功能。请注意,为了这个示例的简单性,我将使用一个公共可用的音乐文件链接,而不是从网易云音乐获取音乐。在实际应用中,你需要确保你使用的音乐文件链接是合法的,并且你拥有使用它们的权利。

代码

<!DOCTYPE html>  
<html lang="en">  
<head>  
<meta charset="UTF-8">  
<meta name="viewport" content="width=device-width, initial-scale=1.0">  
<title>简单网页音乐播放器</title>  
<style>  
  /* 简单的样式 */  
  .player {  
    margin: 20px;  
    text-align: center;  
  }  
  .controls {  
    margin-top: 10px;  
  }  
  button {  
    margin: 5px;  
    padding: 10px 20px;  
    font-size: 16px;  
  }  
</style>  
</head>  
<body>  
  
<div class="player">  
  <audio id="audioPlayer" controls preload="auto">  
    <source src="YOUR_MUSIC_FILE_URL" type="audio/mpeg">  
    您的浏览器不支持audio元素。  
  </audio>  
  <div class="controls">  
    <button onclick="playAudio()">播放</button>  
    <button onclick="pauseAudio()">暂停</button>  
    <button onclick="stopAudio()">停止</button>  
  </div>  
</div>  
  
<script>  
var audioPlayer = document.getElementById('audioPlayer');  
  
function playAudio() {  
  audioPlayer.play();  
}  
  
function pauseAudio() {  
  audioPlayer.pause();  
}  
  
function stopAudio() {  
  audioPlayer.pause();  
  audioPlayer.currentTime = 0; // 将播放位置重置为0  
}  
</script>  
  
</body>  
</html>
过期时间:永久公开
创建于:2024-03-21 17:12
67