動画をランダム表示するScriptで質問です

Question

###動画をランダムで表示したい
ホームページのトップページにて、更新をすることによりランダムで動画を表示するようにしたいのですが、エラーを吐いてしまいます。
また、動画のタイトルは仮なのですが、150弱に動画が増えるかもしれません。

###発生している問題・エラーメッセージ

Uncaught TypeError: video.load is not a function

###該当のソースコード

<video id="video"  width="500" height="500" autoplay="" loop="" video.src = "+" + videolist[vidoenum] + "+"></video>
<script>

var video = document.getElementById("video");

var video = new Array(
"title1.mp4",
"title2.mp4",
"title3.mp4",
"title4.mp4"
);
var videonum = Math.floor(Math.random() * video.length);    
var output = "<video src=" + video[videonum] +">";

video.load(output);
</script>

###試したこと
video.load部分以外にもエラーが出ていたのですが、そちらは解決できていると思います。
また、video.loadは関数ではないと表記されるため、分かりません。

###補足情報(言語/FW/ツール等のバージョンなど)
!DOCTYPE html
meta http-equiv="content-language" content="ja">
<meta http-equiv="content-type" content="text/html:charset=Shift_JIS">

<link rel="stylesheet" href="title.css" type="text/css">

Comments

[kei344]

質問文のコードはそれぞれコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。

Answer 1

まず、下記のような書き方は出来ません。HTMLとJavaScriptが混ざっています。

<video id="video"  width="500" height="500" autoplay="" loop="" video.src = "+" + videolist[vidoenum] + "+"></video>

<video id="video"  width="500" height="500" autoplay="" loop="" src=""></video>

ビデオの部分はこんな感じでは。

var video = document.getElementById("video");
var items = [ "title1.mp4", "title2.mp4", "title3.mp4", "title4.mp4" ];
video.src = items[ Math.floor( Math.random() * items.length ) ];
video.load();
video.play();
// 未テスト

【videoタグの簡単な使い方 - Qiita】
http://qiita.com/grapswiz/items/4ce35afa8bf30d7c0343

【videoタグの動画を切り替える - ゆずめも】
http://yuzu441.hateblo.jp/entry/2015/12/20/173610

Comments

[aosou12]

ご指摘いただいた箇所を修正したところ、動作しました。
ご指摘いただき、ありがとうございます

Answer 2

おそらく、変数を混同しています。

var video = document.getElementById("video");

この直後に

var video = new Array(
"title1.mp4",
"title2.mp4",
"title3.mp4",
"title4.mp4"
);

と上書きしていますから、video.loadはundefinedになると思いますので、そのようなエラーになると思います。
もう少し分かりやすい変数名をつけることをお勧めします。