HTML 動画 引数渡し

Question

こんにちは
抽象的で分かりにくいかも知れませんが、ご教示いただけますと幸いです。

-----前提------------------------------------------------------------

main.htmlの中身
<a href="a1.html">movie</a> //a1ボタンを押すとa1.htmlへ遷移

a1.htmlの中身
<video src="a1.mp4">　

（直接動画を読み込むのではなく、
背景やサイズ、ダウンロード禁止などのコントロールを付与したいため）

-----実現したいこと---------------------------------------------------

動画がたくさんある場合に
わざわざa1,html,a2.html,a3.html・・・を作成するのではなく、

<a href="a.html" src="a1.mp4">movie</a>
例えばこのように引数渡しで表現できないものでしょうか？

-----int32_t様の回答をいただき、追記------------------------------------------------------

<script>
    $(function(){
        var vname = new URL(document.URL).searchParams.get('video');
        var video = document.getElementById('video');
        video.src="vname";
    });
</script>

　　<video id="video"> //再生されない

Comments

[m.ts10806]

「できる」だけで良いでしょうか。

[m.ts10806]

ただ、ファイルのURL直接実行すれば直接確認できます。

Answer 1

例えばこのように引数渡しで表現できないものでしょうか？

リンク元は

<a href="a.html?video=a1.mp4">movie</a>

のようにして、a.html では new URL(document.URL).searchParams.get('video') のようにして動画名を取得して、video要素のsrc属性にセットすればよいでしょう。

Comments

[papo]

int32_t様、ご教示いただきましてありがとうございます。　
追記しておりますが、
URLから取得したvnameをvideo要素のsrc属性にセットしたつもりですが、動画が再生されません。
alert(vname) で動画名a1.mp4は取得できています。
取得した動画名をsrc=”a1.mp4”と直接入力すると再生されます。

Javascriptの記述がおかしいと思うのですが、お教えいただけますでしょうか

[int32_t]

「video.src="vname";」ではなくて「video.src=vname;」でしょう。

[papo]

根本的なところでした・・・
希望の動作できるようになりました。

int32_t様、ありがとうございました。