пытается воспроизвести случайное видео из списка в качестве фона

Question

довольно новый для HTML, поэтому мне нужна помощь. Я пытаюсь воспроизвести случайное видео в качестве фона для своего веб-сайта. У меня уже воспроизводится видео-часть, но я хочу, чтобы он выбирал случайное видео из каталога и воспроизводил его каждый раз при загрузке страницы

Это частичный код для воспроизведения видео

<source src="1.mp4" type="video/mp4">

"1.mp4" - это то, что я пытаюсь изменить каждый раз при загрузке страницы. У меня есть папка в каталоге под названием «bg», где у меня хранится несколько других видео с пометками 1.mp4, 2.mp4 и так далее до 5.mp4. Я не могу понять, как случайно выбрать одно из этих видео и установить его в качестве источника в приведенном выше коде.

спасибо за любую помощь!

Answer 1

Думаю, нужно добавить несколько простых JavaScript. Полный код ниже:

<source src="" id="RandomVid" type="video/mp4">
<script>
    window.onload = function(event) {
        
    document.getElementById("RandomVid").src = Math.floor(Math.random() * 4 + 1).toString() + ".mp4";
  
  //Remove the code below in the real thing
  alert(document.getElementById('RandomVid').src);

    }
</script>

Удалите alert(document.getElementById('RandomVid').src); в вашем реальном, потому что это всего лишь тест, чтобы показать вам, какое видео воспроизводится.

Пояснение :

window.onload запускает код, когда окно полностью загружено.

document.getElementById("RandomVid").src получает атрибут sr c для RandomVid.

Math.floor(Math.random() * 4 + 1) получает Число randowm от 1 до 5.

.toString() + ".mp4" превращает случайное число в строку и добавляет в конец «.mp4»

Это пример, который я запускал на своем компьютере ( Посмотрите на правую руку и атрибут sr c )