Question

我尝试使用一个js动态加载多个视频的视频src。如果我为单个页面添加js代码，它工作正常，但是当组合js代码时，它不起作用。以下是我的代码，任何帮助将不胜感激。

    <!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />


  <link href="http://vjs.zencdn.net/5.11.9/video-js.css" rel="stylesheet">

  <script src="http://vjs.zencdn.net/5.11.9/video.js">

  <script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/3.0.2/videojs-contrib-hls.js"></script>

</style>
</head>
<body>


  <video class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto" width="400px" height="400px" 
  data-setup='{}'>
    <source id="videolong" src="" type="video/mp4">
  </video>



    <script>
document.getElementById("videoshort").src="http://www.w3schools.com/html/mov_bbb.mp4";
 document.getElementById("videolong").src="https://ia600201.us.archive.org/12/items/BigBuckBunny_328/BigBuckBunny_512kb.mp4";     

    </script>

</body>
</html>

我还使用document.getElementById来获取其他信息，例如txt name和src for img。以下是完整的代码，我试图这样做，任何帮助将不胜感激。

document.getElementById("videoshortname").innerHTML = "ShortVideo";   document.getElementById("videoshortimg").src="http://i.imgur.com/82z3hbN.jpg";
document.getElementById("videoshortmp4").src="http://www.w3schools.com/html/mov_bbb.mp4";
document.getElementById("videolongname").innerHTML = "LongVideo";   document.getElementById("videolongimg").src="http://i.imgur.com/PM1qsYT.jpg";
document.getElementById("videolongmp4").src="https://ia600201.us.archive.org/12/items/BigBuckBunny_328/BigBuckBunny_512kb.mp4";

与HTML5视频播放器videojs一起使用时遇到document.getElementById问题

0 个答案: