Javascript YouTube iframe播放器API：控制已在HTML中的多个iframe播放器

我知道以前有人问过这个问题。但是，答案已经过时，我还需要多个iframe播放器的其他信息

我遵循的代码来自。然而，当我试图调用

event.target.playVideo（）时

，在

onPlayerReady（event）函数中

，首次加载页面时未播放视频

我还收到了这个错误消息

GEThttps://i.ytimg.com/vi_webp/M7lc1UVf-VE/sddefault.webp?v=516f0b27 404

现在我正在展示两个视频的示例，分别是

播放视频1

，

停止视频1

，

播放视频2

，和

停止视频2

工作。当有很多视频时，我如何设置代码，以便更紧凑地嵌入它们？谢谢你的帮助

var tag=document.createElement（'script'）；
tag.id='iframe demo'；
tag.src=https://www.youtube.com/iframe_api';
var firstScriptTag=document.getElementsByTagName（'script'）[0]；
firstScriptTag.parentNode.insertBefore（标记，firstScriptTag）；
var-player1；
var-player2；
函数onyoutubeiframeapiredy（）{
player1=新的YT.Player（'existing-iframe-example1'{
活动：{
“onReady”：onPlayerReady1
}
});
player2=新的YT.Player（'existing-iframe-example2'{
活动：{
“onReady”：onPlayerReady2
}
});
}
函数onPlayerReady1（事件）{
event.target.playVideo（）；
$（函数（）{
$（“#play-btn1”）。在（'click'，function（）上{
event.target.playVideo（）；
});
$（'stop-btn1'）。在（'click'，function（）上{
event.target.stopVideo（）；
});
});
}
函数onPlayerReady2（事件）{
event.target.playVideo（）；
$（函数（）{
$（#play-btn2'）。在（'click'，function（）上{
event.target.playVideo（）；
});
$（'stop-btn2'）。在（'click'，function（）上{
event.target.stopVideo（）；
});
});
}

.control{margin bottom:30px；}
.play btn、.stop btn{显示：内联块；边距：10px 20px；颜色：蓝色；光标：指针；}
.play btn:hover、.stop btn:hover{color:orange；cursor:pointer；}

播放视频1
停止视频1
播放视频2
停止视频2

基于此，这是意料之中的。我们所做的实际上是尝试加载

sddefault.jpg

，如果加载失败，我们将返回到所有视频都应该存在的

hqdefault.jpg

。同样，如果视频没有最高分辨率图像，则

maxresdefault.jpg

URL将出现404错误。

感谢您对错误消息的回答。问题在于谷歌开发者网站上的一个示例中使用的视频（视频id:M7lc1UVf VE）。一旦我用不同的视频替换了测试视频，错误就消失了。然而，还有两个问题。第一个问题是，当页面首次加载时，视频没有播放。第二个问题是如何使代码更加紧凑，以嵌入多个YouTube iframe播放器。谢谢你的帮助。