js 调用天气api ajax,[每天进步一点点~] js、jquery调用接口获取天气

天气

.weather-list {

width: 100%;

/*margin-top: 15px;*/

/*font-size: 12px;*/

background-color: pink;

}

.weather-list ul {

width: 20%;

float: left;

background-color: pink;

}

.weather-list ul li {

text-align: center;

color: white;

width: 160px;

overflow: hidden;

}

.weather-list ul li.text {

height: 20px;

}

.weather-list img {

width: 50px;

height: 50px;

}

$.ajax({

type: 'GET',

url: 'http://wthrcdn.etouch.cn/weather_mini?city=北京',

dataType: 'JSON',

error: function () {

alert('网络错误');

},

success: function (res) {

console.log(res);

$('#wea').append(res.data.city);

}

});

getWeather();

function getWeather()

{

$.getJSON('http://wthrcdn.etouch.cn/weather_mini?city=北京', function (result) {

var update_time = Date.parse(result.data.forecast[0].date);

update_time = getTime(update_time);

$('.tianqi_icon').html(setWeatherIcon(result.data.forecast[0].type));

$('.weather-header-city').append(result.city);

$('.weather-content-content .wea').html(result.data.forecast[0].type);

$('.weather-content-content .tem').html(result.data.forecast[0].high + '~' + result.data.forecast[0].low);

$('.weather-list').html('');

var str = '';

var tianqi_icon = setWeatherIcon(result.data.forecast[0].type);

var wea = result.data.forecast[0].type;

var tem = result.data.forecast[0].high + '~' + result.data.forecast[0].low;

var week = '今天';

for (var i = 0; i < 3; i++)

{

if (i > 0) {

tianqi_icon = setWeatherIcon(result.data.forecast[i].type);

week = result.data.forecast[i].date;

wea = result.data.forecast[i].type;

tem = result.data.forecast[i].high + '~' + result.data.forecast[i].low;

}

str +='

• \n' +

'

'+week+'\n' +

'

'+tianqi_icon+'\n' +

'

'+wea+'\n' +

'

'+tem+'\n' +

'

';

}

$('.weather-list').html(str);

})

}

// 根据天气设置背景图片

function setBgImg(wea)

{

var bg_img = '';

if (wea.indexOf("阴") >= 0) {

bg_img = 'url("images/duoyun.png")';

} else if (wea.indexOf("小雨") >= 0) {

bg_img = 'url("images/xiaoyu.png")';

} else if (wea.indexOf("多云") >= 0) {

if (wea.indexOf("小雨") >= 0) {

bg_img = 'url("images/xiaoyu.png")';

} else {

bg_img = 'url("images/duoyun.png")';

}

} else {

bg_img = 'url("images/qingtian.png")';

}

return bg_img;

}

// 根据天气设置图标

function setWeatherIcon(wea)

{

var wea_img = '';

if (wea.indexOf("阴") >= 0) {

wea_img = '';

} else if (wea.indexOf("小雨") >= 0) {

wea_img = '';

} else {

wea_img = '';

}

return wea_img;

}

function getTime(timestamp)

{

var date = new Date(timestamp);

var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';

var m = (date.getMinutes() <10 ? '0' + date.getMinutes() : date.getMinutes());

return h+m;

}