ajax访问阿里云天气接口,获取7天天气

复制代码
$.ajax({
    url: 'https://ali-weather.showapi.com/day15',
    type: 'GET', // 或者 'POST',根据API要求
    dataType: 'json', // 预期服务器返回的数据类型
    headers: {
        'Authorization': "APPCODE c63ddd9d9f404df1913593131ff84a67",// 将'你的API密钥'替换为实际的API密钥
        'X-Requested-With': 'XMLHttpRequest' //跨域
    },
    crossDomain: true,  //跨域
    data: {
        area: area,
    },
    success: function (response) {
        // 请求成功时的回调函数
        console.log(response); // 处理返回的数据
        var dayList = response.showapi_res_body.dayList;
        if (dayList==null){
            alert("暂时无法获取天气数据")
        }else{
            var html = '';
            for(let i=1;i<8;i++){
                console.log(dayList[i]['daytime']);
                html += '<div class="weather-item" >'+
                    '<div style="color: white">'+dayList[i]['daytime'].substring(4)+'</div>'+
                    '<img class="weather-icon" src="'+dayList[i]['day_weather_pic']+'">'+
                    '<div class="weather-temp" style="color: white">'+dayList[i]['day_air_temperature']+'℃</div></div>';
            }
            $('#weatherForecast').html(html);

        }
    },
    error: function (xhr, status, error) {
        // 请求失败时的回调函数
        console.error("An error occurred: " + error);
    }
});

注意空格是个坑

相关推荐
Zha0Zhun9 分钟前
一个使用ViewBinding封装的Dialog
前端
兆子龙9 分钟前
从微信小程序 data-id 到 React 列表性能优化:少用闭包,多用 data-*
前端
滕青山10 分钟前
文本行过滤/筛选 在线工具核心JS实现
前端·javascript·vue.js
时光不负努力12 分钟前
编程常用模式集合
前端·javascript·typescript
恋猫de小郭19 分钟前
Apple 的 ANE 被挖掘,AI 硬件公开,宣传的 38 TOPS 居然是"数字游戏"?
前端·人工智能·ios
小岛前端23 分钟前
Node.js 宣布重大调整,运行十年的规则要改了!
前端·node.js
OpenTiny社区24 分钟前
OpenTiny NEXT-SDK 重磅发布:四步把你的前端应用变成智能应用
前端·javascript·ai编程
梦想CAD控件40 分钟前
在线CAD开发包结构与功能说明
前端·javascript·vue.js
张拭心1 小时前
春节后,有些公司明确要求 AI 经验了
android·前端·人工智能
时光不负努力1 小时前
typescript常用的dom 元素类型
前端·typescript