使用CSS，你可以这样做，如果你添加以下样式的标签，但你需要一个wav文件:

<style type="text/css">
        .beep {cue: url("beep.wav") }
</style>

var body=document.getElementByTagName("body");
body.className=body.className + " " + "beep";

没有跨浏览器的方法来实现这纯javascript。相反，您可以使用一个小的.wav文件，使用嵌入或对象标记播放。

以下是我如何使用HTML5让它发出哔哔声: 首先我复制并将windows wav文件转换为mp3，然后我使用以下代码:

var _beep = window.Audio("Content/Custom/Beep.mp3")

function playBeep() { _beep.play()};

全局声明声音文件并在需要时引用它会更快。

function beep(freq = 660, duration = 90, vol = 50) { var context = new(window.AudioContext || window.webkitAudioContext); const oscillator = context.createOscillator(); const gain = context.createGain(); gain.gain.setValueAtTime(0, context.currentTime); gain.gain.linearRampToValueAtTime(1, context.currentTime + 0.002); oscillator.connect(gain); oscillator.frequency.value = freq; oscillator.type = "square"; gain.connect(context.destination); oscillator.start(context.currentTime); oscillator.stop(context.currentTime + duration * .001); oscillator.onended = () => context.close(); } <br> <center><button onclick="beep()">Beep!</button></center>

/*if you want to beep without using a wave file*/
var context = new AudioContext();
var oscillator = context.createOscillator();
oscillator.type = "sine";
oscillator.frequency.value = 800;
oscillator.connect(context.destination);
oscillator.start(); 
// Beep for 500 milliseconds
setTimeout(function () {
    oscillator.stop();
}, 100);                
            

上面的答案在当时是正确的，但现在是错误的;你可以用纯javascript实现。但是使用javascript的一个答案不再有效，而其他答案非常有限或不使用纯javascript。

我做了我自己的解决方案，工作得很好，让你控制音量，频率和波型。

//if you have another AudioContext class use that one, as some browsers have a limit
var audioCtx = new (window.AudioContext || window.webkitAudioContext || window.audioContext);

//All arguments are optional:

//duration of the tone in milliseconds. Default is 500
//frequency of the tone in hertz. default is 440
//volume of the tone. Default is 1, off is 0.
//type of tone. Possible values are sine, square, sawtooth, triangle, and custom. Default is sine.
//callback to use on end of tone
function beep(duration, frequency, volume, type, callback) {
    var oscillator = audioCtx.createOscillator();
    var gainNode = audioCtx.createGain();
    
    oscillator.connect(gainNode);
    gainNode.connect(audioCtx.destination);
    
    if (volume){gainNode.gain.value = volume;}
    if (frequency){oscillator.frequency.value = frequency;}
    if (type){oscillator.type = type;}
    if (callback){oscillator.onended = callback;}
    
    oscillator.start(audioCtx.currentTime);
    oscillator.stop(audioCtx.currentTime + ((duration || 500) / 1000));
};

有人建议我编辑一下，说明它只适用于某些浏览器。然而，据我所知，所有现代浏览器似乎都支持Audiocontext。它在IE上不受支持，但微软已经停产了。如果您在特定的浏览器上有任何问题，请报告。

注意:把这段代码放在你想要出现哔哔声的地方。 并且记住指定存储哔哔声的目录或文件夹(源)。

<script>
//Appending HTML5 Audio Tag in HTML Body
$('<audio id="chatAudio"><source src="sound/notify.ogg" type="audio/ogg"><source src="sound/notify.mp3" type="audio/mpeg"><source src="sound/notify.wav" type="audio/wav"></audio>').appendTo('body');

$('#chatAudio')[0].play();
</script>

参考:http://www.9lessons.info/2013/04/play-notification-sound-using-jquery.html。

我在我正在开发的社交媒体中实现了这一点，它的工作发现，聊天时像facebook一样的通知，通知你有一个新的聊天消息