How to add a video to an html page through javascript

I'm trying to add a video to an html page without adding a source through the video tag.

I've created a .txt file with the html & javascript code.

I've added to the .txt file this code into the video tag:

<video id="Vid" controls="controls" style="width: 100%; height: 80%; border: thick groove #FF0000" oncontextmenu="return false">

I added that code into my html and in script tag i added:

<script>

window.onload = function () {
var xhr = new XMLHttpRequest();
xhr.open('GET', '../filevideo/video.mp4', true);
xhr.responseType = 'blob'; //important
xhr.onload = function (e) {
if (this.status == 200) {
console.log("loaded");
var blob = this.response;
var video = document.getElementById('Vid');
video.oncanplaythrough = function () {
console.log("Can play through video without stopping");
URL.revokeObjectURL(this.src);
};
video.src = URL.createObjectURL(blob);
video.load();
}
};
xhr.send();
}

</script>

I would like to add a video from my video folder in my website project to javascript without adding the source to the video tag. I'm trying to not have the video be available to download in the "save page" feature in the browser but at the same time show in the video player of my html page. With the javascript code i did above it prevented the video to be downloaded to my local host desktop. I'm hoping people have multiple alternative codes in javascript to do this. Thank you to all who read and respond.