iframe埋め込みコードのsrc属性に変数を代入したい

Question

いつもお世話になっております。

自作サイト内でYouTubeのiframe埋め込みコードを使っているのですが、
src属性の動画IDの部分に変数を代入し、JavaScriptで再生する動画を動的に変更したいです。

<iframe id="ytplayer" type="text/html" width="100%" height="50%"
 src="https://www.youtube.com/embed/xxxxxx?autoplay=1&rel=0" frameborder="0" allowfullscreen>

上記の、xxxxxxの部分に動画IDを入れる変数を入れたいのですが、そのようなことは可能でしょうか？

初歩的な質問で申し訳ないですが、ご教示いただければと思います。
どうぞよろしくお願い致します。

Answer 1

DOM APIについて調べてみて下さい。

• document.getElementById - Web API インターフェイス | MDN
• element.setAttribute - Web API インターフェイス | MDN
• HTMLIFrameElement - Web API インターフェイス | MDN

Re: tsumi さん

Comments

[退会済みユーザー]

setAttributeを使って実現できました！URLも貼ってくださり、ご親切にどうもありがとうございました。

Answer 2

iframeのsrc自体はただの文字列ですから、変更は可能でしょう
ただしiframeの飛び先がクロスドメインだったときに先方から
拒否られることはあります。（youtubeはたぶん大丈夫だと思いますが）