javascript - 如何通过YouTube API javascript将youtube视频附加到网站

Question

我在JS中有以下代码:

/*
Video play
=========================== */
$("#ytplayer").css({'opacity':'0','filter':'alpha(opacity=0)'});
$( ".start-video" ).on("click",function(){
    $('#ytplayer').fadeTo(900, 1);$( ".video-image" ).fadeOut(800);
    return false;
});
$(document).on('click', '.start-video', function () {
    $(this).fadeOut(800);
    player.playVideo();
    return false;
});

我在HTML中有以下代码:

<div class="col-md-6">
    <div class="video-wrapper">
        <div class="video-container">
            <div id="ytplayer" class="player"></div>
        </div>
        <button class="start-video"></button>
        <div class="video-image"><img src="img/img-video.jpg" class="img-responsive" alt="" /></div>
    </div>
    <img src="img/shadow-video.png" class="img-responsive" alt="" />
</div>

我不知道将iFrame从YouTube粘贴到哪里。请帮忙。

Answer 1

<div class="col-md-6">
<div class="video-wrapper">
    <div class="video-container">
        <div id="ytplayer" class="player">
          <iframe width="560" height="315" src="https://www.youtube.com/embed/xmVRZr91Qok" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
      </div>
    </div>
    <button class="start-video">Start</button>
    <div class="video-image"><img src="img/img-video.jpg" class="img-responsive" alt="" /></div>
</div>
<img src="img/shadow-video.png" class="img-responsive" alt="" />

您需要做的就是将iframe广告代码添加到ytplayer Div中