APIデータをjavascriptで制御する方法について

Question

openweathermapで取得した風速データを元に、風速を表示し、さらに風速によって背景画像を変えたいと考えていますが、if文の書き方がわかりません。

js

  url: "http://api.openweathermap.org/data/2.5/weather?q=Tokyo,jp&appid=xxxxx",
  cache: false,
  success:function (weatherdata){
// img insert


// 位置
document.getElementById('here').innerHTML = weatherdata.name;

document.getElementById('wind').innerHTML = weatherdata.wind.speed;


}
});
コード

html

<div id = "main0">
  <h2>
    
    <span id="here"></span><br/>
  
    <span id="wind"></span>
    <span>m/s</span>
  </h2>
  </div>
コード

JavaScriptで風速データを取得しています。
windで風速をHTMLに表示することはできています。
このid=windを使ってif文を書くことはできるのでしょうか、回答お願いいたします。

Comments

[kei344]

HTMLにはwindタグというものはありません。HTMLやjsの全体像を追記いただいたほうが回答がしやすいと思います。

Answer 1

weatherdata.wind.speedに風速が入っているのでしたら、こっちを使って処理を行うのが良いかと思います

Comments

[elf_ggo]

内容を更新しました。
weatherdata.wind.speedに風速は入っています。
id=windを使ったif分の書き方がわからないのですが教えていただくことは可能でしょうか。お願い致します。

Answer 2

ifを使わず分岐するとか。

document.getElementById( 'wind' ).style.backgroundImage = 'url(http://example.com/path/to/img/' + weatherdata.wind.speed + ')';

【style.backgroundImageプロパティ - JavaScript（ジャバスクリプト）リファレンス】
http://alphasis.info/2013/10/javascript-dom-styleobject-backgroundimage/

【style.backgroundImageに代入するパスは相対？絶対？ - masutaroの日記】
http://d.hatena.ne.jp/masutaro/20070812/1186899235

Answer 3

if (weatherdata.wind.speed < x1) {
cssの処理1(背景変更)
} else if (weatherdata.wind.speed < x2) {
cssの処理2(背景変更)
}

こんな感じで背景を変更したらいかがでしょうか？