JavaScriptから取得した画像を読み込むにはどうすればいいですか？

Question

var loadingImage = image.src(data.points_of_interest[i].main_image); 
var bodystuff = document.createElement('img'); 
bodystuff.innerHTML = loadingImage, 
bodystuff.innerHTML = loadingImage, 
document.getElementById('outputs').appendChild(bodystuff); 

これは私のJavascriptです。これは私のHTMLです。

<section id="outputs">  
</section> 

API応答からの画像の場所はここにあります。 data.points_of_interest[i].main_image

（それはURL形式= "https://upload.wikimedia.org/wikipedia/commons/thumb/3/37/Westminster_Abbey_West_Door.jpg/337px-Westminster_Abbey_West_Door.jpg" であることに注意ください）

（また、それは[I]の使用、したがってループ内にあります）。

任意のポインタを入力してください。

私の上記のコードは、コンソールにURLを表示するだけです。

おかげ

Answer 1

このお試しください：[img要素を作成するためのJavaScriptコードは何が最善か]の

var src = data.points_of_interest[i].main_image; // URL of the image 
var bodystuff = document.createElement('img'); 
bodystuff.src=src; 
document.getElementById('outputs').appendChild(bodystuff);