Jquery 我的网站加载缓慢，因为嵌入的视频太多

我的网站加载缓慢，因为嵌入的视频太多。我看到哪里有图像（视频嵌入位置的上方），然后单击它，此时，嵌入式视频被加载。有人能帮我弄清楚怎么做吗？如果你将鼠标悬停在图像上，youtube是否会嵌入？非常感谢

用户单击图像后，只需使用jQuery插入嵌入代码即可：

仅示例代码：HTML

<div id="video" style="background-color:red; width:560px; height:315px;"></div>

jQuery：

$('#video').on('click', function() {
    $(this).html('<iframe width="560" height="315" src="//www.youtube.com/embed/9bZkp7q19f0?autoplay=1" frameborder="0" allowfullscreen></iframe>').css('background', 'none');
});

$('#video').on('click', function() {
$(this).html('<iframe width="560" height="315" src="//www.youtube.com/embed/9bZkp7q19f0?autoplay=1" frameborder="0" allowfullscreen></iframe>').css('background', 'none');
});

function getYoutubeID(url) {
    var id = url.match("[\\?&]v=([^&#]*)");
    id = id[1];
    return id;
};
$('a.youtube').each(function() {
    var id = getYoutubeID( this.href );
    this.id = id;
    var thumb_url = "http://img.youtube.com/vi/"+id+"/maxresdefault.jpg";
    $('<img width="100%" src="'+thumb_url+'" />').appendTo($('#video'));
});

$（'#video'）。在（'click'，function（）上{
$（this.html（“”）.css（'background'，'none'）；
});
函数getYoutubeID（url）{
var id=url.match（“[\\？&]v=（[^&\\]*）”；
id=id[1]；
返回id；
};
$（'a.youtube'）。每个（函数（）{
var id=getYoutubeID（this.href）；
this.id=id；
var thumb_url=”http://img.youtube.com/vi/“+id+”/maxresdefault.jpg”；
$（''）。附加到（$（'#视频'）；
});

---

用缩略图编码：

试着不要嵌入这么多视频？每页的最大值通常应为一！你做了哪些研究工作？有很多可用的信息，问题太广泛了，你们是如何嵌入它们的？通常只有按play键时才开始加载。。因此，可能是其他原因导致加载缓慢？好吧，您应该显示从视频中提取的缩略图，并按需加载每个视频，只需添加一个旁注<代码>自动播放对iDevices不起作用。这太完美了！非常感谢你@Ashkan Mobayen Khiabani编辑了我的答案以提取缩略图。

$('#video').on('click', function() {
$(this).html('<iframe width="560" height="315" src="//www.youtube.com/embed/9bZkp7q19f0?autoplay=1" frameborder="0" allowfullscreen></iframe>').css('background', 'none');
});

function getYoutubeID(url) {
    var id = url.match("[\\?&]v=([^&#]*)");
    id = id[1];
    return id;
};
$('a.youtube').each(function() {
    var id = getYoutubeID( this.href );
    this.id = id;
    var thumb_url = "http://img.youtube.com/vi/"+id+"/maxresdefault.jpg";
    $('<img width="100%" src="'+thumb_url+'" />').appendTo($('#video'));
});