如何在 divbox Javascript 中添加 YouTube 嵌入（iframe）

【问题标题】：How to add YouTube embed (iframe) inside of divbox Javascript如何在 divbox Javascript 中添加 YouTube 嵌入（iframe）
【发布时间】：2020-06-03 15:45:23
【问题描述】：

如何使用文本输入字段、提交按钮和 javascript 在 Divbox 内添加 YouTube 嵌入式 iframe？

谢谢。

【问题讨论】：

什么是“divbox”？你的尝试在哪里？
嗨，请参阅本指南以获得更好的问题写作。 stackoverflow.com/help/how-to-ask 永远记得放一个代码示例，以及所需的行为。

标签： javascript iframe youtube embedding

【解决方案1】：

通过将“Divbox”表示为“div”，我尝试了一个答案：如果用户知道视频 ID（youtube url 末尾的字符串），您可以执行以下操作：

document.getElementById("b").onclick = function(d) {
  var full = '<iframe width="560" height="315" src="https://www.youtube.com/embed/' + document.getElementById("inp").value + '" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'
  document.getElementById("frame").innerHTML = full;
}

<button id="b">Go!</button>
<input id="inp" value="MPZI2M1fDi8"/>
<div id="frame"></div>

【讨论】：