Vimeo api - Iterate through multiple videos on a page

Question

New to JS, iframes and the Vimeo api here

I'm trying to use this idea to disable forward seeking for some videos on a WP site.

It works for a single video, as I understand that document.querySelector('iframe') will just choose the first iframe.

However if I have a page of videos, I'd like it to work on multiple specific videos.

To the relevant iframes I've added class='noskip'

Then to iterate I thought I could do:

var noskips = document.querySelectorAll('.noskip');

for (var i = 0, len = noskips.length; i < len; i++) {
   }

But I'm not sure how to then pass each iframe into the actual player function:

var player = new Vimeo.Player(iframe);
var timeWatched = 0;


player.on("timeupdate", function(data) {
  if (data.seconds - 1 < timeWatched && data.seconds > timeWatched) {
    timeWatched = data.seconds;
           
  }
});

player.on("seeked", function(data) {
  if (timeWatched < data.seconds) {
    player.setCurrentTime(timeWatched);
  }
});

Answer 1

Ok I think I worked it out. Suggestions for improvement welcome !

var noskips = document.querySelectorAll('.noskip');
var iframes = Array.prototype.slice.call(noskips);

iframes.forEach(function(iframe) {

    var player = new Vimeo.Player(iframe);
    var timeWatched = 0;

    player.on("timeupdate", function(data) {
      if (data.seconds - 1 < timeWatched && data.seconds > timeWatched) {
        timeWatched = data.seconds;
      }
    });

    player.on("seeked", function(data) {
      if (timeWatched < data.seconds) {
        player.setCurrentTime(timeWatched);
      }
    });
    
});