如果你不想打乱HTML元素:

var audio = new Audio('audio_file.mp3');
audio.play();

功能播放(){ var audio = new audio ('https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3'); audio.play (); ｝ <按钮onclick = "打()“>播放音频> < /按钮

这使用了HTMLAudioElement接口，它以与<audio>元素相同的方式播放音频。

如果你需要更多的功能，我使用了嚎叫.js库，发现它简单而有用。

< script src = " https://cdnjs.cloudflare.com/ajax/libs/howler/2.1.1/howler.min.js " > < /脚本> < >脚本 var声音=新的嚎叫({ src(“https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3”):, 体积:0.5, Onend:函数(){ 警报(“完成了!”); ｝ })； sound.play () > < /脚本

如果你想在当前浏览器选项卡未被选中的情况下也能播放声音，你必须在页面加载时加载音频资源。

像这样:

var audio = new Audio('audio/path.mp3');

function playSound(){
    audio.play();
}

请参阅这个问题了解更多细节

var song = new Audio();
song.src = 'file.mp3';
song.play();

简单的Jquery

//设置没有预加载的音频标签

<audio class="my_audio" controls preload="none">
    <source src="audio/my_song.mp3" type="audio/mpeg">
    <source src="audio/my_song.ogg" type="audio/ogg">
</audio>

//添加jquery加载

$(".my_audio").trigger('load');

//编写播放和停止的方法

function play_audio(task) {
      if(task == 'play'){
           $(".my_audio").trigger('play');
      }
      if(task == 'stop'){
           $(".my_audio").trigger('pause');
           $(".my_audio").prop("currentTime",0);
      }
 }

//决定如何控制音频

<button onclick="play_audio('play')">PLAY</button>
<button onclick="play_audio('stop')">STOP</button>

EDIT

为了解决@stomy的问题，这里是你如何使用这种方法来播放播放列表:

将你的歌曲设置在一个对象中:

playlist = {
    'song_1' : 'audio/splat.mp3',
    'song_2' : 'audio/saw.mp3',
    'song_3' : 'audio/marbles.mp3',
    'song_4' : 'audio/seagulls.mp3',
    'song_5' : 'audio/plane.mp3'
}

像以前一样使用触发器和播放功能:

$(".my_audio").trigger('load');

function play_audio(task) {
      if(task == 'play'){
           $(".my_audio").trigger('play');
      }
      if(task == 'stop'){
           $(".my_audio").trigger('pause');
           $(".my_audio").prop("currentTime",0);
      }
 }

动态加载第一首歌:

keys = Object.keys(playlist);
$('.my_audio').append("<source id='sound_src' src=" + playlist[keys[0]] + " type='audio/mpeg'>");

当当前歌曲结束时，将音频源重置为播放列表中的下一首歌:

count = 0; 
$('.my_audio').on('ended', function() { 
   count++;  
   $("#sound_src").attr("src", playlist[keys[count]])[0];
   $(".my_audio").trigger('load');
   play_audio('play');
});

请参见这里的实际代码示例。

我有一些问题与播放音频，特别是因为Chrome已经更新，用户必须首先与文档交互。

然而，在我发现的几乎所有解决方案中，JS代码都必须主动设置监听器(例如按钮点击)来接收用户事件，以便播放音频。

就我而言，我只是想让游戏在玩家与之互动时播放BGM，所以我为自己设置了一个简单的监听器，不断检查网页是否正在进行互动。

const stopAttempt = setInterval(() => {
    const audio = new Audio('your_audio_url_or_file_name.mp3');
    const playPromise = audio.play();
    if (playPromise) {
      playPromise.then(() => {
        clearInterval(stopAttempt)
      }).catch(e=>{
        console.log('' + e);
      })
    }
}, 100 )

这是一个相当老的问题，但我想补充一些有用的信息。话题发起者提到他正在“制作一款游戏”。所以对于所有需要音频进行游戏开发的人来说，有比<audio>标签或HTMLAudioElement更好的选择。我认为你应该考虑使用Web Audio API:

虽然网页上的音频不再需要插件，但音频标签为实现复杂的游戏和交互式应用程序带来了巨大的限制。Web Audio API是一个高级JavaScript API，用于在Web应用程序中处理和合成音频。此API的目标是包含现代游戏音频引擎中的功能，以及现代桌面音频制作应用程序中的一些混合、处理和过滤任务。