Javascriptの「xは関数ではありません」

Question

私は2つの別々のボタンで2本のビデオを開始し、停止しようとしています。私は単純にコードをコピーして変数の名前を変更しましたが、コードの一部は動作しません。 'TypeError：video2.pauseはHTMLButtonElement.cの関数ではありません。'というエラーが表示されます。ビデオとボタンの両方がモーダルに置かれます。特に同じコードが動作している場合、この奇妙なエラーが発生するのはなぜですか？

Javascriptを：

var video = document.getElementById("video.mp4"); 
    var playButton = document.getElementById("play-pause"); 

    var video2 = document.getElementById("video2.mp4"); 
    var play = document.getElementById("play-pause2"); 

    playButton.addEventListener("click", function a() { 
     if (video.paused == true) { 
      video.play(); 
      playButton.innerHTML = "Pause"; 
     } else { 
      video.pause(); 
      playButton.innerHTML = "Play"; 
     } 
     }); 

    play.addEventListener("click", function c() { 
     if (video2.paused == true) { 
      video2.play(); 
      play.innerHTML = "Pause"; 
     } else { 
      video2.pause(); 
      play.innerHTML = "Play"; 
     } 
     }); 

HTML：

<video width="900px" height="600px" id="Digital_Poster.mp4" /> 
     <source src="assets/video.mp4" type="video/mp4" id="video.mp4"/> 
     Sorry, this browser does not support the 'video' tag. 
    </video> 
    <div id="video-controls"> 
     <button type="button" id="play-pause">Play</button> 
    </div> 

    <video width="900px" height="600px"> 
     <source src="assets/video2.mp4" type="video/mp4" id="video2.mp4"/> 
     Sorry, this browser does not support the 'video' tag. 
    </video> 
    <div id="video-controls"> 
     <button type="button" id="play-pause2">Play</button> 
    </div> 

Answer 1

あなたは<video>要素に.pauseを呼び出す必要がありますが、idは<source>ものに設定されています。 <video>タグにそれを移動すると、それを動作させる必要があります。

<video width="900px" height="600px" id="video.mp4"> 
     <source src="assets/video.mp4" type="video/mp4" /> 
     Sorry, this browser does not support the 'video' tag. 
    </video> 
    <div id="video-controls"> 
     <button type="button" id="play-pause">Play</button> 
    </div> 

    <video width="900px" height="600px" id="video2.mp4"> 
     <source src="assets/video2.mp4" type="video/mp4" /> 
     Sorry, this browser does not support the 'video' tag. 
    </video> 
    <div id="video-controls"> 
     <button type="button" id="play-pause2">Play</button> 
    </div> 

ちなみに、私は、最初の行に>に/>を修正しました。また、IDがvideo-controlsに設定された2つの要素を宣言することは不正です。HTML classes（指摘に感謝@ zer00ne）を使用することを検討してください。