ТипError: video_playlist is null JavaScript

Question

Я пытаюсь создать список воспроизведения видео, и я новичок в JS, поэтому у меня возникло множество проблем.

Я пытаюсь запустить этот код:

//Simple JS Playlist by Kristi Witts - https://github.com/kwitts/js-playlist/ 
 
//MIT License 
 

 
//Ensure all links in the div "#player" act in the same way: 
 
var video_playlist = document.getElementById("myVideo"); //Element ID should be the same as the ID used in the container div in the HTML. 
 
var links = video_playlist.getElementsByTagName('a'); 
 
for (var i = 0; i < links.length; i++) { 
 
    links[i].onclick = handler; 
 
}; 
 
//Give functionality to the links: 
 
function handler(e) { 
 
    e.preventDefault(); //Prevents default action of links going directly to the source file 
 
    videotarget = this.getAttribute("href"); //looks at the filename in the link's href attribute 
 
    filename = videotarget.substr(0, videotarget.lastIndexOf('.')) || videotarget; //Splits the filename and takes everything before the ".", giving us just name without the extension 
 
    video = document.querySelector("#myVideo video"); //Finds div #player and video 
 
    video.removeAttribute("poster"); //Removes the poster attribute in the video tag 
 
    source = document.querySelectorAll("#myVideo video source"); //Finds source elements inside the video tag 
 
    source[0].src = filename + ".mp4"; //defines the MP4 source 
 
    video.load(); //Loads video when video is selected 
 
    video.play(); //Plays video automatically 
 
    return false; 
 
};

<div class="six columns"> 
 
    <div class="videoContainer"> 
 
    <video id="myVideo" controls preload="auto" poster="images/1-thm.png" width="600" height="350"> 
 
     <source src="videos/1.mp4" type="video/mp4" /> 
 
     <p>Your browser does not support the video tag.</p> 
 
    </video> 
 
    <div class="caption">Screamer 2015 Intro</div> 
 
    <div class="control"> 
 
     <div class="topControl"> 
 
     <div class="progress"> 
 
      <span class="bufferBar"></span> 
 
      <span class="timeBar"></span> 
 
     </div> 
 
     <div class="time"> 
 
      <span class="current"></span><i>/</i> 
 
      <span class="duration"></span> 
 
     </div> 
 
     </div> 
 
     <div class="btmControl"> 
 
     <div class="btnPlay btn" title="Play/Pause video"></div> 
 
     <div class="btnFS btn" title="Switch to full screen"></div> 
 
     <div class="volume" title="Set volume"> 
 
      <span class="volumeBar"><i></i></span> 
 
     </div> 
 
     <div class="sound sound2 btn" title="Mute/Unmute sound"></div> 
 
     </div> 
 
    </div> 
 
    <div class="loading"></div> 
 
    </div> 
 
</div> 
 
<div class="five columns" id="playlist-parent"> 
 
    <div id="playlist"> 
 
    <img src="#" class="thumbnails" id="2"><a href="videos/2.mp4">Screamer | Intro | Version (Step Style)</a> 
 
    <img src="#" class="thumbnails" id="3"><a href="videos/3.mp4">Screamer | Speedart | Joined Naive! </a> 
 
    <img src="#" class="thumbnails" id="4"><a href="videos/4.mp4">Screamer | Speedart | AE7 Banner</a> 
 
    <img src="#" class="thumbnails" id="5"><a href="videos/5.mp4">Screamer | Speedart | Luck 7 Snipers Banner</a> 
 
    <img src="#" class="thumbnails" id="6"><a href="videos/6.mp4">Screamer | Speedart | ESmthz Banner (Client Work)</a> 
 
    <img src="#" class="thumbnails" id="7"><a href="videos/7.mp4">Screamer | Speedart | Solar #SolarDRC</a> 
 
    <img src="#" class="thumbnails" id="8"><a href="videos/8.mp4">Screamer | Speedart | Dare Creations</a> 
 
    <img src="#" class="thumbnails" id="9"><a href="videos/9.mp4">Screamer | Speedart | Line Banner | New Style?</a> 
 
    <img src="#" class="thumbnails" id="10"><a href="videos/10.mp4">Screamer | Speedart | Version 2-in-1</a> 
 
    </div> 
 
</div>

Но я получаю TypeError: video_playlist is null Я хотел бы знать, почему это происходит и что я могу сделать, чтобы исправить это, и предотвратить это в будущем, когда я знаю, как это произошло.

По какой-то причине (я думаю, это может быть этот видео_плейер пуст), мой плейлист не заменяет видео в проигрывателе, но он открывается и воспроизводит видео, как обычно, если вы выбрали файл> открыть с > светлячок.

Последний вопрос

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 Смежные вопросы

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.