Javascript MP3文件未在自定义控件中播放

我想用一个很酷的按钮：

我遇到的两个问题是我不能播放声音。我已经把mp3文件放在根目录中，所以我假设我需要

<button class='button'>
  <sound src="play.mp3" type="audio/mpeg">
</button>

当我使用标准的音频控制，它的作品很好，但我真的想使用这个酷豆按钮。如果我想把文本放在按钮的右边，我该怎么办

另外，如果我想有一个音频文件列表，如何实现

---

感谢您的帮助您可以像这样使用html

<button onclick="play_pause()">play/pause</button>
<audio src="music.mp3" id="music"></audio>

function play_pause(){

            if(document.getElementById("music").paused){ //check whether music is paused
            document.getElementById("music").play();     //if paused then play it
            }

            else{document.getElementById("music").pause();} //else pause it
        }

---

要将文本放在按钮的右侧，您需要将所有内容放在另一个显示框中：flex；属性和伸缩方向：行

对于音频，我用javascript创建了一个新的音频对象。然后我可以很容易地从代码开始和停止它

要使用多个声音，我们编辑toggleSound（）函数以使用字符串作为歌曲名称。然后我们在字符串上循环检查是否有与之相关联的声音。这是无限扩展的。只需在switch语句和按钮中添加更多音频对象和新案例即可控制它们

您可以看到，在每个按钮中，我们必须提供音频名称，因此每个声音可以有多个按钮

//一些音频示例
const song1=新音频(
"https://ia800905.us.archive.org/19/items/FREE_background_music_dhalius/backsound.mp3"
);
//其他一些音频
const song2=新音频(
"https://ia800905.us.archive.org/19/items/FREE_background_music_dhalius/FormulaFantasy.mp3"
);
功能切换声音（audioName）{
//切换歌曲名称的每个案例。
开关（audioName.toString（））{
案例“song1”：
var x=song1；
打破
案例“song2”：
var x=song2；
打破
违约：
//设置默认歌曲
var x=song1；
}
如果（x暂停）{
x、 play（）；
}否则{
x、 暂停（）；
}
}

。按钮{
利润率：0 10px 10px 0；
背景：浅灰色；
}
.按钮：悬停{
光标：指针；
}
.家长{
显示器：flex；
弯曲方向：立柱；
}

歌曲1
第一首歌的整洁按钮。
歌曲2
第二首歌的按钮。

尝试发布您尝试过的内容以及您被击中的地方，Stack overflow旨在帮助用户在社区的帮助下解决问题。这太棒了，非常感谢！如果我想通过创建一个声音列表来扩展它，有没有一种编写数组的方法可以让它更简单？而不是复制每个项目的代码？例如，功能切换声音1,2。按钮1，2…你好，布兰登，我已经编辑了我的原始答案，添加了一个有效的系统。我意识到你也可以使用关联数组来存储歌曲，但我没有在答案中添加。你看过电影抓拍吗？你是刀锋鲍里斯！这真是太棒了。非常感谢绝地大师网站开发者没问题！如果您没有其他问题，可以将答案设置为正确，以便其他人也可以使用。