https://cn-front-fifa2026.com/tags/aplayer/Recent content in APlayer on 世界杯赛事平台-聚焦2026FIFA全球焦点比赛Hugozh-cnSun, 26 Apr 2026 00:00:00 +0000https://cn-front-fifa2026.com/post/aplayer-test/Sun, 26 Apr 2026 00:00:00 +0000https://cn-front-fifa2026.com/post/aplayer-test/本文档旨在测试 APlayer 音频播放器在 Hugo 网站中的集成与表现。APlayer 是一款功能强大且易于定制的 HTML5 音频播放器，支持多种播放模式和功能，如播放列表、随机播放、循环播放、音量控制、进度条拖拽等。 集成 APlayer 到 Hugo 站点通常涉及在 Markdown 文件中插入特定的短代码或 HTML 结构，并确保 Hugo 的主题或配置能够正确渲染这些元素。本文将展示 APlayer 的基本用法，包括单个音频文件的播放以及播放列表的创建。 单个音频文件播放示例： <figure> <figcaption>播放示例：世界杯主题曲</figcaption> <audio controls src="/path/to/your/audio/worldcup-anthem.mp3"> 您的浏览器不支持 audio 元素。 </audio> </figure> 在实际的 Hugo 项目中，音频文件通常会放置在 static 文件夹下，并通过相对路径进行引用。 播放列表示例： APlayer 同样支持创建包含多个音频文件的播放列表，这对于发布播客或音乐专辑非常有用。通过 APlayer 的 JavaScript API 或预设的短代码，可以方便地实现这一点。 <div id="player1" class="aplayer"></div> <script> var ap1 = new APlayer({ element: document.getElementById('player1'), mini: false, autoplay: false, showlrc: false, audio: [ { name: '歌曲名1', artist: '艺术家1', url: '/path/to/song1.