HTML5簡單鋼琴代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML5簡單鋼琴代碼</title>
</head>
<body>
<audio id="c" src="sound/c.mp3"></audio>
<audio id="d" src="sound/d.mp3"></audio>
<audio id="e" src="sound/e.mp3"></audio>
<audio id="f" src="sound/f.mp3"></audio>
<audio id="g" src="sound/g.mp3"></audio>
<audio id="a" src="sound/a.mp3"></audio>
<audio id="b" src="sound/b.mp3"></audio>
<div>
<button onclick="play('c')">C</button>
<button onclick="play('d')">D</button>
<button onclick="play('e')">E</button>
<button onclick="play('f')">F</button>
<button onclick="play('g')">G</button>
<button onclick="play('a')">A</button>
<button onclick="play('b')">B</button>
</div>
<script>
function play(note) {
var audio = document.getElementById(note);
audio.currentTime = 0; // 重置音頻文件的播放位置
audio.play(); // 播放音頻文件
}
</script>
</body>
</html>上述代碼實現(xiàn)了一個簡單的鋼琴，包含了七個按鍵，分別對應了do、re、mi、fa、so、la、ti七個音符，點擊按鍵即可播放相應的音樂。
在代碼中，使用了HTML5中的<audio>標簽，其音頻src屬性指定了鋼琴鍵對應的音樂文件的地址。同時，采用JavaScript編寫了play()函數(shù)，用于響應按鍵事件，實現(xiàn)了鋼琴的音樂播放功能。
在實際開發(fā)過程中，可以根據(jù)需要增加更多的音符和按鍵，用JavaScript添加更復雜的交互響應，打造更加完美的音樂體驗。