I'm a beginner in Web development, but now have started to write cool websites. I applied a video background to my webpage, did all the stylings, and looks cool, but how can I change it every time I reload the HTML page?
<video id="vidtest" autoplay muted loop>
<source src= "videos/vid.mp4" type="video/mp4">
</video>
Create an array with your video paths in it, randomly select an array item, then set it as the src attribute of your video source:
var source = document.getElementById('video-source');
var videos = [
"vid1.mp4",
"vid2.mp4",
"vid3.mp4"
];
var randomVideo = videos[Math.floor(Math.random() * videos.length)];
source.setAttribute('src', randomVideo);<video id="vidtest" autoplay muted loop>
<source id="video-source" src= "videos/vid.mp4" type="video/mp4">
</video>