HTML 音频/视频 DOM currentTime 属性

在网页开发中，我们经常会涉及到音频和视频的播放控制，而控制音频和视频的播放进度就需要用到currentTime属性。currentTime属性是HTML音频/视频DOM元素的一个属性，用于设置或返回媒体的当前播放时间。

1. 获取和设置currentTime属性

要获取或设置音频/视频的当前播放时间，可以通过以下方式操作：

// 获取音频/视频元素
var media = document.getElementById('myMedia');

// 获取当前播放时间
var currentTime = media.currentTime;

// 设置当前播放时间
media.currentTime = 30; // 将播放时间设置为30秒

在上面的示例中，我们首先通过document.getElementById方法获取了一个id为myMedia的音频/视频元素，然后可以通过currentTime属性获取或设置当前播放时间。在这个例子中，我们将当前播放时间设置为30秒。

2. 监听currentTime变化

如果我们想要在音频/视频的当前播放时间发生变化时进行一些操作，可以通过监听timeupdate事件来实现。timeupdate事件在音频/视频的currentTime属性发生变化时触发。

media.addEventListener('timeupdate', function() {
    console.log('当前播放时间：' + media.currentTime);
});

在上面的代码中，我们通过addEventListener方法监听了音频/视频元素的timeupdate事件，并在事件触发时打印当前播放时间。

3. 应用场景

currentTime属性在实际应用中有很多用途，比如制作一个自定义的音频/视频播放器，可以实现拖动进度条改变播放进度的功能；或者实现一个定时跳转到指定时间点的功能等等。

总之，currentTime属性是控制音频/视频播放进度的重要属性之一，熟练掌握它可以帮助我们更好地实现音频/视频播放控制功能。

希望本文对你有所帮助，谢谢阅读！