Monaca(js)でAPIを叩く

OpenWeatherMapのAPIを叩く

前準備として、OpenWeatherMapのサインアップをする必要があります。
このidは東京都のidですね。自分の地区のidは
https://openweathermap.org/city/1850147
ここから検索すると取れます。
weatherの部分を変えることで、違ったjsonを取ることができます。

page.html

<div style="text-align: center" class="page2main"></div>

main.js

  var URL = "http://api.openweathermap.org/data/2.5/weather?id=1850147&unit=units&APPID=<<MYAPPID>>"
  $.getJSON( URL, function( data ) {
    res = data;
    var temp = res['weather'][0]
    console.log(temp.main);
    
    var df = document.createDocumentFragment();
    var item = document.createElement('div');
    item.innerHTML = temp.main;
    
    var images = document.createElement('img');
    images.setAttribute("src", "http://openweathermap.org/img/w/" + temp.icon + ".png");
    
    df.appendChild(images);
    df.appendChild(item);
    $(".page2main").empty()
    var mainNode = document.getElementsByClassName('page2main')[0];
    mainNode.appendChild(df)
  }

Monaca要素が皆無でしたね(笑)