JavaScriptでsrc要素に埋め込み

###JavaScriptでsrc要素に埋め込み
<input type="text">に入力されたURLを<iframe>のsrcに埋め込みたいです。JavaScriptでリロードなしで埋め込みたいです。どうすればいいですか？
######プログラム
指摘されて追加。

html
1<!DOCTYPE html>
2<html>
3  <head>
4    <meta charset="utf-8">
5    <link rel="stylesheet" href="style.css">
6    <title>Page Title</title>
7  </head>
8  <body>
9        <input type="text" id="input-id" placeholder="URL">
10        <div id="id"></div>
11    <script src="script.js"></script>
12  </body>
13</html>

JavaScript
1window.addEventListener("keydown",e=>{if(e.keyCode === 13){
2    document.getElementById('id').innerHTML = `<iframe id="id-id" src="${document.getElementById('input-id').value}" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>`;
3}});

追記：漠然としていてすみません。僕がやりたかったのは、Kosuke_Shibuyaさんが回答してくれたプログラムそのものです。URLを入力されたら、それを埋め込みたかったです。

Lhankor_Mhy

2019/05/03 06:27

「innerHTMLでやりたい」とは具体的にはどういう意味でしょうか？ Element.innerHTML = '<iframe src="...">...'; みたいな話ですか？

kei344

2019/05/03 06:34

https://teratail.com/questions/187533 この質問と内容が同じです。teratailは質問内容の編集ができるので、変更がある場合は新しい質問をするのではなく編集してください。また、こちらの質問を削除されるよう運営に連絡されることをお勧めします。 https://teratail.com/help#delete-question https://teratail.com/contact/input

m.ts10806

2019/05/03 07:11

「innerHTMLではできない」という回答でもいいんですか？できるかどうかは別としてまず自身でやってみてください。

退会済みユーザー

2019/05/03 07:35

innerHTMLじゃなくてもいいです。

m.ts10806

2019/05/03 07:40

いずれにしても丸投げのままなのでまず調べてやってみてから質問してください。なにも調べてないなら調べるところから。というか質問するより調べてやってみたほうが早い内容です

退会済みユーザー

2019/05/05 12:15

すみません。質問が漠然としていました。修正しました。

行動規範の内容に同意します

回答1件

ベストアンサー

html
1<!doctype html>
2<html lang="ja">
3  <head>
4    <meta charset="UTF-8">
5    <title>Document</title>
6  </head>
7  <body>
8    <div>
9      <form action="">
10        <div>
11          <input type="text" id="input">
12        </div>
13        <iframe id="res"></iframe>
14      </form>
15    </div>
16    <script>
17        let input = document.getElementById('input');
18        input.addEventListener('input', function(){
19          document.getElementById('res').src = this.value;
20        });
21    </script>
22  </body>
23</html>