无法从带有 jquery 的 API 获取天气值

Question

I try to get the weather values from the weather API and i can not take the city name and the other properties. When i try to push them in the array items can not project it to HTML page

See the code below:

var url = "https://api.weatherbit.io/v2.0/forecast/daily?city=london,gb,&key=f0e406af6ebf4937862f9f50ae78125b";

function getWeather(){
$.getJSON( url, function( data ) {
  var items = [];
  $.each( data, function( key, val ) {
    var weather = {
      cityName:val.city_name,
      longtitude:val.lon,
      timezone:val.timezone,
      latitude:val.lat,
      countryState:val._state
    }


    items.push("<li>"+weather+"</li>");
  });

  $( "<ul/>", {
    "class": "my-new-list",
    html: items.join( "" )
  }).appendTo( "body" );
});
}

Answer 1

You can access those properties like in the demo.

Here is working Demo: https://jsfiddle.net/usmanmunir/acghx45z/19/

 var url = "https://api.weatherbit.io/v2.0/forecast/daily?city=london,gb,&key=f0e406af6ebf4937862f9f50ae78125b"; function getWeather(){ $.getJSON( url, function( data ) { var items = []; let newData = {} $.each(data, function( key, val ) { if (key;= 'data') { newData[key] = data[key] } }). $,each(newData, function( key. val ) { items:push("<li>"+key+"; "+val+"</li>"); }), $( "<ul/>": {"class", "my-new-list":html. items});appendTo( "body" ); }); } getWeather()

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Answer 2

Here is a simplified version:

var url = "https://api.weatherbit.io/v2.0/forecast/daily?city=london,gb,&key=f0e406af6ebf4937862f9f50ae78125b";

function getWeather(){
$.getJSON( url, function( data ) {
  var items = [];

  items.push("<li>"+data.city_name+"</li>");
  items.push("<li>"+data.lon+"</li>");
  items.push("<li>"+data.timezone+"</li>");
  items.push("<li>"+data.lat+"</li>");
  items.push("<li>"+data.state_code+"</li>");


  $( "<ul>", {
    "class": "my-new-list",
    html: items.join( "" )
  }).appendTo( "body" );
});
}

getWeather();

You don't need a loop. In fact, from what you're trying to do, a loop makes no sense if all you're trying to get are these specific values.

In your code, you loop over every key in the data object and create a new object with every iteration that gets then pushed to your items array. You are also trying to access undefined values.

The answer from above isn't correct since it goes through every key in the object which itself can be an object and results in broken output like [object].

Have a look at the documentation over at mozilla: Javascript - Working with objects