javascript - javascript内のhtml要素にjavascript変数を代入したい

Question

javascript内のhtml要素にjavascript変数値を挿入しようとしています..しかし、正しく動作していません..以下は私のコードです..

 window.onload = function() {
    var image=document.getElementById('img').value;
        var img = '<div id="pic"><img src="image" width="200" height="108" /><p></p></div>';
      }

これが関数です。ここで、変数イメージでイメージを取得しています..このイメージを 1 つの div id pic に割り当てようとしています..そこに、var イメージで取得した src="image" を割り当てています..しかし、機能していません。 .

Answer 1

文字列に値を挿入する必要があります。

var img = '<div id="pic"><img src="' + image + '" width="200" height="108" /><p></p></div>';

Answer 2

代わりにこれを行うべきだと思います：

window.onload = function() {
    var image=document.getElementById('img').value;
    document.getElementById('pic').innerHTML='<img src="'+image+'" width="200" height="108" /><p></p>';
}

Answer 3

次のようになります。

 var img = '<div id="pic"><img src="'+image+'" width="200" height="108" /><p></p></div>';