Error: Attribute audio_url not allowed on element li at this point

Question

我已经创建了一个音频播放列表。它是一个包含多个列表项的无序列表。 <li> 元素定义属于无序列表的列表项。每个列表项都包含一个音频 url 和一个图像 url。

<ul class="playlist list-group list-group-flush">

     <li audio_url="music/Intro.mp3" img_url="images/isos_ep.jpg" 
     class="active 
     list-group-item playlist-item">
     Intro</li>

     <li audio_url="music/Castaway.mp3" class="list-group-item playlist-
     item" 
     img_url="images/isos_ep.jpg">
     Castaway</li>

     <li audio_url="music/Robert_Smith.mp3" class="list-group-item playlist-
     item" img_url="images/isos_ep.jpg">
     Robert Smith</li>

     <li audio_url="music/Stolen_Youth.mp3" img_url="images/isos_ep.jpg" 
     class="active list-group-item playlist-item">
     Stolen Youth</li>
     <li audio_url="music/Red_Vines.mp3" class="list-group-item playlist-
      item" 
     img_url="images/isos_ep.jpg">
     Red Vines</li>

     <li audio_url="music/On_the_Attack.mp3" class="list-group-item 
     playlist-
     item" img_url="images/south_migration.jpg">
     On the Attack</li>

     <li audio_url="music/South_Migration.mp3" 
     img_url="images/south_migration.jpg" class="active list-group-item 
     playlist-item">
     South Migration</li>

</ul>

该代码运行良好，没有任何问题，但据我了解，这些不是列表项允许的有效属性。列表项可以具有 type 和 value 的有效属性，以及全局和事件属性。因此，我包含的属性会导致验证错误。我已经尝试了很多修复 - 例如将音频和 img urls 包装为 <div> 或 <audio> 但没有任何成功。

当我在 W3C 验证器上检查它时，我收到错误消息：

Error: Attribute audio_url not allowed on element li at this point.

我不确定如何修复它。有什么建议吗？

Answer 1

如果你想保持这样的标记，你可以将 data- as prefix 添加到你发明的属性中：

<li data-audio_url="music/Castaway.mp3" 
    class="list-group-item playlist-item" 
    data-img_url="images/isos_ep.jpg">
Castaway
</li>

但通常使用语义标记会更好。例如，像这样：

<li>
  <button type="button" data-audio_url="music/Castaway.mp3">
    <img src="images/isos_ep.jpg" alt="">
    Castaway
  </button> 
</li>

（假设单击将曲目添加到播放列表）

Error: Attribute audio_url not allowed on element li at this point

Error: Attribute audio_url not allowed on element li at this point

html

w3c-validation