本文介绍了如何使用HTML和JavaScript实现音频元素的自动播放、暂停、刷新以及控制音频的src、volume和循环播放功能。代码展示了如何通过按钮操作来控制audio元素的行为。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>audio</title>
</head>
<body>
<!-- <audio autoplay controls="controls">
<source src="media/A0.MP3" type="">
</audio> -->
<!--
src: 设置或返回音频元素的当前来源
autoplay 设置是否在加载完成后随即播放音频
controls 设置或返回音频是否显示控件
loop 设置或返回音频是否在结束时重新播放
volume 设置或返回音频音量
-->
<audio src="media/A0.MP3" autoplay loop controls="controls" volume=></audio>
<button class="play">播放</button>
<button class="pause">暂停</button>
<button class="reload">刷新</button>
<script type="text/javascript">
var play = document.querySelector('.play');
var pause = document.querySelector('.pause');
var reload = document.querySelector('.reload');
var audio = document.querySelector('audio');
console.dir(audio)
play.onclick = function() {
audio.play(); // 开始播放音频
}
pause.onclick = function() {
audio.pause(); // 暂停播放音频
}
reload.onclick = function() {
audio.load(); // 重新加载音频元素
}
</script>
</body>
</html>上述运行结果：
1171
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
