javascript - 我想在图像标签的路径中写图标名称

Question

我正在使用 Dark Sky API 来获取天气信息，并且图标参数给了我多云、部分多云、晴天等。我在文件夹中保存了与图标名称相同的图标图像。我想在源路径中写这个参数，比如

 <img src="..\..\icon\weather\  $forecast.weatherDays[0].icon .png" height="300vh" width="300vw">

天气.html

  <div id="day1"> <div id="icon"></div> </div>
 <div id="day2"> <div id="icon"></div> </div>

天气管理器.js

document.querySelector("#day1 #icon").innerHTML=forecast.weatherDays[0].icon;
document.querySelector("#day2 #icon").innerHTML=forecast.weatherDays[0].icon;

我怎样才能做到这一点？

标签： javascripthtml

Answer 1

您需要使用以下代码在 div 中添加图像：

var forecast = {};
forecast.weatherDays = [];

forecast.weatherDays[0]= { icon :'partly-cloudy'};
forecast.weatherDays[1]= { icon :'image8-2'};

//console.log(forecast.weatherDays)

document.querySelector("#day1 #icon").innerHTML= '<img src="..\\..\\icon\\weather\\'+forecast.weatherDays[0].icon+'.png" height="300vh" width="300vw">';

 document.querySelector("#day2 #icon").innerHTML= '<img src="https://blog.hubspot.com/hubfs/'+forecast.weatherDays[1].icon+'.jpg" height="300vh" width="300vw">';

 <div id="day1"> <div id="icon"></div> </div>

 <div id="day2"> <div id="icon"></div> </div>