javascript 从其他来源触发YouTube播放，删除占位符图片和自定义播放图标

Posted 2021-05-03

(function(MISK, $, undefined) {
  'use strict';

  const videoTrigger = document.querySelector('.js-video-trigger');
  const videoEmbed = document.querySelector('.js-video-embed');
  const activeClass = 'video__video-anchor--active';
  const embedUrl = videoEmbed.getAttribute('data-autoplay-src');

  /**
  * Remove the placeholder image and play the video
  */
  function playVideo() {
    videoTrigger.classList.add(activeClass);
    videoEmbed.setAttribute('src', embedUrl);
  }

  /**
   * @memberOf MISK
   * @namespace MISK.video
   */
  MISK.video = {
    init: function() {
      const videos = document.querySelectorAll('.js-video-trigger');
      for (let i = 0; i < videos.length; i++) {
        const video = videos[i];
        video.addEventListener('click', playVideo);
      }
    }
  };
}(window.MISK = window.MISK || {}, jQuery));