将json链接到png图像到html

Question

因为我相信你会亲自看到，我在编码方面相对较新。我一直在努力从json文件中获取png图像以显示在我的codepen上。我已经尝试了几次在我的Stackoverflow搜索中找到的建议，但我没有试过似乎适用于我的情况。

这里的链接到我的codepen： http://codepen.io/mbabaian/pen/MpjbZv

我试图用这个时间来获取图像的代码是：

var currentIcon = wd.current.condition.icon; 
     // weather icon settings 
    $("#current-icon").html("<img src='wd.current.condition.icon' alt='weather icon'/> "); 

而这里的特定的JSON数据在图像位于：

https://api.apixu.com/v1/current.json?key=68629a769f564f9bb6450153170703&q=auto:ip 

请让我知道你是否需要任何额外的信息从我这里。提前致谢。

Answer 1

只需使用

$("#current-icon").html("<img src='"+wd.current.condition.icon+"' alt='weather icon'/> "); 

这里是你的更新codepen

Answer 2

创建currentIcon，用它

$("#current-icon").html('<img src="'+currentIcon+'" alt="weather icon"/>');