在 JavaScript 中创建哔声
Anika Tabassum Era
2024年2月15日
本文展示了两种在 JavaScript 中创建哔声的方法。
在 JavaScript 中创建哔声
哔声通常用作某些功能的警报。但是一般的 JavaScript 约定没有任何特定的方法或属性来遵循这种操作。
有两种执行任务的方法。一种是与 HTML 标签交互，另一种是在 script 标签中操作。
在这里，我们将看到在 HTML 标签中添加音频源的示例。我们还将看到另一个实例，它在音频构造函数中获取哔哔声的 URL，然后在操作后触发。
在 JavaScript 中使用 audio HTML 标签来发出哔哔声
我们需要在 HTML audio 标签中添加声音的来源。在定义音频和源结构时，我们添加了一个按钮元素来触发函数 playbeep()。
我们将获取音频元素并在脚本部分执行其功能。当它被 sound.play() 触发时，它会创建一个与附加源相对应的声音（哔声）。
代码片段：
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p>Press the Button</p>
<audio id="Audio" >
<source src="https://www.soundjay.com/misc/censor-beep-01.mp3"
type="audio/mpeg">
</audio>
<button onclick="playbeep()">Press Here!</button>
<script>
var sound = document.getElementById('Audio');
function playbeep(){
sound.play()
}
</script>
</body>
</html>
输出：
在 JavaScript 中为 Beep 使用 audio 构造函数
JavaScript Audio 构造函数获取声音源。在 HTML 部分，只需要一个按钮和一个 onclick 函数，并且无论何时调用它，都会触发获取 URL 的 sound 对象。
代码片段：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h2>Press the Button</h2>
<button onclick="playbeep()">Press Here!</button>
<script>
function playbeep() {
var sound = new Audio('https://www.soundjay.com/misc/censor-beep-01.mp3');
sound.play();
}
</script>
</body>
</html>
输出：
