在页面上获取Youtube视频ID并设置为播放列表参数

Question

我有一个正在使用的功能，用于向页面上显示的任何youtube视频添加参数，该功能目前有效

 <p><iframe src="//www.youtube.com/embed/Vdwef9DF?start=1" width="560" height="315" frameborder="0" allowfullscreen="allowfullscreen"  allow="autoplay"></iframe></p>

 const youtubeUrlPattern = /^((?:https?:)?\/\/)?((?:www|m)\.)?((?:youtube\.com|youtu.be))(\/(?:[\w\-]+\?v=|embed\/|v\/)?)([\w\-]+)(\S+)?$/;

  [...document.querySelectorAll('iframe')].filter((iframeEl) => {
    // Filter to iframes loading YouTube URLs only.
    return iframeEl.src.match(youtubeUrlPattern);
  }).forEach((iframeEl) => {
    const a = document.createElement('a');
    a.href = iframeEl.src;
    a.search = a.search || '?';
    a.search += '&autoplay=1&mute=1&loop=1&rel=0';
    iframeEl.src = a.href;
  });

但是，我也想添加播放列表参数，例如&playlist={videoID}

在这种情况下，如何从任何YouTube网址获取ID并创建变量以正确设置此播放列表属性？