javascript - 使用javascript将视频添加到div

Question

我想在点击链接后使用javascript将视频添加到div中。这是我的一些代码!我不确定我是否做对了，因为我以前从未使用过带有javascript的视频:

                 var vid = document.createElement("source");
                     vid.src="youtube link";
                     vid.type="application/x-shock wave-flash";
                     vid.style.width = "330px";
                     vid.style.height = "200px";
                 var x = document.getElementById('bottom');
                     x.appendChild(vid);

                     <div id="bottom"></div>

Answer 1

我认为这不是使用YouTube视频的有效方法，因为您没有获得实际的视频链接。 Youtube具有如下所示的公开可用的嵌入链接:

<iframe width="560" height="315" src="//www.youtube.com/embed/9kd-PoHWah8" frameborder="0" allowfullscreen></iframe>

您可以使用javascript创建它。 Live demo here (click).

var iframe = document.createElement('iframe');
iframe.src = 'http://www.youtube.com/embed/9kd-PoHWah8';
iframe.width = '560';
iframe.height = '315';

var bottom = document.getElementById('bottom');
bottom.appendChild(iframe);

有关更多信息和更多高级选项，请参见 the iframe api docs here (click):