HTML5 对媒体元素进行了增强，引入了 <audio> 和 <video> 元素，使得在网页中嵌入音频和视频变得更加简单。以下是关于这两个元素的基本用法：

<audio> 元素
<audio controls>
  <source src="audio.mp3" type="audio/mp3">
  Your browser does not support the audio tag.
</audio>

  •  controls 属性添加了音频播放器的控件，如播放、暂停、音量控制等。

  •  <source> 元素用于指定音频文件的源和类型。您可以提供多个 <source> 元素，浏览器将选择支持的第一个源。


<video> 元素
<video width="640" height="360" controls>
  <source src="video.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>

  •  width 和 height 属性用于设置视频播放器的宽度和高度。

  •  controls 属性添加了视频播放器的控件。

  •  <source> 元素用于指定视频文件的源和类型。


此外，HTML5 还引入了一些 JavaScript API，允许通过脚本控制媒体的播放、暂停等操作。例如，可以使用 play() 方法开始播放媒体，使用 pause() 方法暂停播放。
<script>
  var audio = document.getElementById("myAudio");
  
  function playAudio() {
    audio.play();
  }

  function pauseAudio() {
    audio.pause();
  }
</script>

这是一个简单的示例，展示了如何通过 JavaScript 控制音频的播放和暂停。


转载请注明出处：http://www.pingtaimeng.com/article/detail/12495/HTML5