将png图像从json链接到html [重复]

Question

我相信您将亲眼看到，我在编码方面相对较新。我一直在努力从 json 文件中获取 png 图像以显示在我的 codepen 上。我已经尝试了在 Stackoverflow 搜索中找到的几个建议，但我尝试过的任何建议似乎都不适用于我的情况。

这是我的代码笔的链接： 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"/>');