具有相同ID的多个元素

Question

我试图在同一页面上使用相同ID(#vid)的三个视频上使用脚本.目前只有一个视频似乎能够使用该脚本.

var video = document.getElementById('vid')
// When the 'ended' event fires
video.addEventListener('ended', function(){
  // Reset the video to 
  video.currentTime = 0;
  // And play again
  video.load();
});

Answer 1

Id必须是独一无二的 您应该使用class而不是使用document.getElementsByClassName('className');

var video = document.getElementsByClassName('vid');
var myFunction = function() {
    // Reset the video to 
    this.currentTime = 0;
    // And play again
    this.load();
};

for (var i = 0; i < video.length; i++) {
    video[i].addEventListener('ended', myFunction, false);
}