ウェザーハック　GAS HTMLテンプレート

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>

    <?
    // weatherData()を実行しJSONを取得
    var data = weatherData();

    // JSONデータ内にある「title」要素を取得
    var title = data["title"];
    ?>

    <!-- 取得した「title」要素をh1タグで表示 -->
    <h1><?= title ?></h1>

    <?
    // 最終行に取得した「text」要素をh1タグで表示
    output.append('<p>' + data["description"]["text"] + '</p>');
    ?>

    <?
    var count = data["forecasts"].length;

    // 取得した天気情報のforecastsをループで表示
    for(var i=0; i<count; i++) {
    ?>

    <h3><?= data["forecasts"][i]["dateLabel"] ?></h3>
    <ul style="list-style-type: circle">
      <li><?= data["forecasts"][i]["date"] ?></li>
      <li><?= data["forecasts"][i]["telop"] ?></li>
      <img src="<?= data["forecasts"][i]["image"].url ?>">
    </ul>

    <?
    }
    ?>

  </body>
</html>