Получать уведомления при изменении времени <video>

Question

Я хотел бы отобразить текущий процент видео с использованием расширения Firefox.

Я знаю, что могу узнать текущее время и продолжительность с помощью API Player Youtube :

player = document.getElementById('movie_player')
currentTime = player.getCurrentTime()
duration = player.getDuration()

И я могу добавить узел в DOM с помощью appendChild или insertBefore.

Но я не понимаю, как периодически обновлять DOM с течением времени.

Я пытался понять, как проигрыватель Youtube обновляет отображение времени с помощью инспектора, но мне это не помогло:

Полагаю, мне нужно каким-то образом использовать события, но я не знаю, какое событие может периодически запускаться без вмешательства пользователя (щелчок, наведение, ...).

Answer 1

Звучит так, как будто вы ищете timeupdate Медиа Событие :

Время, указанное атрибутом currentTime элемента, изменилось.

const vid = document.querySelector('video')

vid.addEventListener('timeupdate', e => {
  console.log(vid.currentTime)
})

<video autoplay width="320" height="240" controls>
  <source src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerFun.mp4" type="video/mp4">
</video>