Pull Weather API Data Использование JSON и добавление к ли?

У меня возникли проблемы с выяснением того, как вытащить данные API OpenWeatherMap и добавить их к соответствующим li в моем html. Спасибо за вашу помощь, я застрял прямо сейчас с помощью следующего кода:Pull Weather API Data Использование JSON и добавление к ли?

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>Project 21</title> 
    <style> 
    html {margin:2em; font-size:2em; font-family:Helvetica, Arial, sans-serif;} 
    h1 {margin:0 0 0.2em; color:#369;} 
    img {float:left; margin-right:1em;} 
    ul {float:left; margin:0; padding:0; list-style:none;} 
    </style> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
</head> 
<body> 
    <section> 
    <h1>Current Weather for </h1> 
    <div class="img" id="data-img"></div> 
    <ul> 
     <li><b>Conditions:</b> <span id="data-current"></span></li> 
     <li><b>Temperature:</b> <span id="data-temp"></span>&deg;</li> 
     <li><b>Humidity:</b> <span id="data-humidity"></span>%</li> 
     <li><b>Wind Speed:</b> <span id="data-wind"></span>mph</li> 
    </ul> 
    </section> 
    <script> 
    $.getJSON('http://api.openweathermap.org/data/2.5/weather?callback=?', 
    { 'zip': '46556,us', 'units':'imperial' }, 
    function(data){ 
     console.log(data); 
    }) 
    .fail(function(jqxhr, textStatus, error) { 
    console.log("Request Failed"+ textStatus + "," + error); 
    }); 



    </script> 
</body> 
</html>

источник

2015-04-22 Syd

Вы должны искать JQuery селекторы для того, чтобы манипулировать атрибуты тегов или текст. Но, вот ваш ответ:

$.getJSON('http://api.openweathermap.org/data/2.5/weather?callback=?', { 'zip': '46556,us', 'units': 'imperial' }, function(data){ 
      console.log(data); 
      $("#data-current").text(data.weather[0].description); 
      $("#data-temp").text(data.main.temp); 
      $("#data-humidity").text(data.main.humidity); 
      $("#data-wind").text(data.wind.speed); 
     }) 
     .fail(function(jqxhr, textStatus, error) { 
     console.log("Request Failed" + textStatus + "," + error); 
     });

Для того, чтобы использовать другие данные, связанные с openWeather, проверьте данные, которые вы показываете в консоли.

источник

2015-04-22 23:10:33

Спасибо! Но он все еще ничего не показывает, нужно ли мне иметь действие, такое как onload? – Syd

Это странно, потому что работает точный код в моем браузере. Что отображается в консоли браузера при доступе к странице? –

Странно, в моей консоли ничего нет. Ах, неважно, глупый, у меня был тот же файл в другой папке - открыл не тот! Еще раз спасибо! – Syd

Pull Weather API Data Использование JSON и добавление к ли?

ответ

Смежные вопросы