百度API 免费接口获取天气预报

发布时间:2020-08-06 05:38:12

来源:51CTO

阅读:4726

作者:大大果

Document

#result{width: 800px;border:1px solid #ddd;margin-top: 30px;background: #aaa;display: none;}

#result p{height: 25px;line-height: 25px;padding-left: 20px;color: #fff;font-weight: bold;font-size: 16px;}

#result p span{padding: 0 10px;display: inline-block;width: 120px;text-align:center;height: 25px;line-height: 25px;}

#result p span.temp{width: 250px;text-align: left;margin-left: 20px;}

$(function(){

$(window).on('load',function(){

$.ajax({

'type':'get',

'url':'http://apis.baidu.com/heweather/weather/free?city=beijing',

'headers':{'apikey':'2c6d2927ef76200697018e989f6afbbb'},

'success':function(data){

$('#result').show();

data = data['HeWeather data service 3.0'][0];

var basic_info = '城市:' + data.basic.cnty + ' ' + data.basic.city;

var tianqi = data.daily_forecast;

$('

' + basic_info + '

').appendTo('#result');

$('

日期气温天气

').appendTo('#result');

$.each(tianqi,function(index,element){

var html = '';

var date = element.date;

var temperature = element.tmp.min + '°C - ' + element.tmp.max + '°C';

var w1 = element.cond.txt_d;

var w2 = element.cond.txt_n;

var weather;

if(w1 == w2){

weather = w1;

}

else{

weather = w1 + ' 转 ' + w2;

}

html += ''+ date +'' + ''+ temperature +'' + ''+ weather +'';

$('

'+ html +'

').appendTo('#result');

});

}

});

});

$('#query').on('click',function(){

$('#result').hide().empty();

var city = $.trim($('#city').val());

$.ajax({

'type':'get',

'url':'http://apis.baidu.com/heweather/weather/free',

'data':{'city':city},

'headers':{'apikey':'2c6d2927ef76200697018e989f6afbbb'},

'success':function(data){

$('#city').val('');

data = data['HeWeather data service 3.0'][0];

console.log(data);

var basic_info = '城市:' + data.basic.cnty + ' ' + data.basic.city;

var tianqi = data.daily_forecast;

$('

' + basic_info + '

').appendTo('#result');

$('

日期气温天气

').appendTo('#result');

$.each(tianqi,function(index,element){

var html = '';

var date = element.date;

var temperature = element.tmp.min + '℃ - ' + element.tmp.max + '℃';

var w1 = element.cond.txt_d;

var w2 = element.cond.txt_n;

var weather;

if(w1 == w2){

weather = w1;

}

else{

weather = w1 + ' 转 ' + w2;

}

html += ''+ date +'' + ''+ temperature +'' + ''+ weather +'';

$('

'+ html +'

').appendTo('#result');

$('#result').show();

});

}

});

});

});

html百度天气api,百度API 免费接口获取天气预报相关推荐

  1. java接口获取天气预报json数据

    https://blog.csdn.net/weixin_38959210/article/details/83515783 首先进上面这个链接的文档里面,获取到JAVA调用HTTP接口的方法. 我们 ...

  2. 【API】开源免费接口管理

    接口文档管理平台 该平台主要用于整合后端各系统的服务,每个空间根据用户的空间权限,可以对接口文档进行不同层度的操作. 该平台涵盖了: 接口文档导入(基本不用额外代码) 权限管理 调试 格式化导出 主要 ...

  3. python通过调用百度天气API接口获取天气信息

    python调用百度接口,获取天气信息 需要到百度注册开发者账号,通过账号获取到每个账号私有的应用访问(AK) 使用此脚本还需要district_id.csv文档,在我资源中可以免费下载,也可在百度天 ...

  4. android百度天气接口api接口,百度天气接口api

    百度天气接口 以GET形式提交,返回JSON或XML URL:http://api.map.baidu.com/telematics/v3/weather?location={城市名}&out ...

  5. php调用天气预报接口,PHP调用百度天气接口API实现查询实时天气

    现在,不用守着晚上7点半的时间去看第二天的天气预报,只要你有手机,有网络,便可以轻松查询实时天气,可你知道怎么用PHP实现的吗?本文将带大家学习一种调用百度天气接口的方式,直接在PHP上查看实时天气, ...

  6. php 百度天气接口api接口,PHP调用百度天气接口API实现查询实时天气

    现在,不用守着晚上7点半的时间去看第二天的天气预报,只要你有手机,有网络,便可以轻松查询实时天气,可你知道怎么用PHP实现的吗?本文将带大家学习一种调用百度天气接口的方式,直接在PHP上查看实时天气, ...

  7. php百度天气api接口,php使用百度天气接口示例

    这篇文章主要介绍了百度天气接口使用示例,需要的朋友可以参考下 注意地区要转码的 百度ak申请地址: 复制代码 代码如下: $city="嘉兴"; $content = file_g ...

  8. 使用百度天气API制作天气组件

    这里写自定义目录标题 百度天气APi 百度API调用 处理思路 代码层面得实现 文件介绍 百度天气APi 目前百度天气API提供全国得实时查询,但是没有提供历史查询,在一些应用中需要天气模块,如果是和 ...

  9. php 调取百度天气api

    现在,不用守着晚上7点半的时间去看第二天的天气预报,只要你有手机,有网络,便可以轻松查询实时天气,可你知道怎么用PHP实现的吗?本文将带大家学习一种调用百度天气接口的方式,直接在PHP上查看实时天气, ...

最新文章

  1. MATLAB_8-边缘检测_大长腿干扰下识别人脸
  2. php页面是什么原因,PHP空白页面常见原因及解决方法
  3. HTML 資訊汲取(中篇) - Default namespace 問題
  4. vl02n 批次拆分
  5. java lambda循环_使用Java 8 Lambda简化嵌套循环
  6. 统计一行文本的单词个数_word操作技巧:不同情况的文字统计方法
  7. linux 跨服务器备份,用BackupPC架设Linux跨平台备份服务器
  8. 计算机发展英语思维导图,怎样画出英语课文总结思维导图
  9. 结合源代码分析一个完整的中断过程【转】
  10. python大文件排序_Python如何实现大文件排序?Python大文件排序的实现方法
  11. Hibernate注解----关联映射注解以及课程总结详解----图片版本
  12. 此时墨迹在计算机上不起作用,win7系统自带截图工具不见了怎么找回
  13. 程序猿麒麟臂打造之路(健身二)
  14. [蓝桥杯][java]信用卡号验证问题
  15. Python中求矩阵的逆
  16. (侯捷C++)1.1面向对象高级编程(上)
  17. 驾驶证上的照片有具体要求吗?这几点需要注意
  18. 计量经济学计算机答案14章,伍德里奇---计量经济学第8章部分计算机习题详解(STATA)...
  19. 2.1 Mybatis——log4j日志文件应用
  20. 【程序8】乒乓球比赛赛程安排

热门文章

  1. [动画工具] Animations
  2. Python多线程参考资料
  3. 使用R完成决策树分类
  4. 云锁多机版云中心使用测评
  5. 使用 Azure Site Recovery 灾难恢复至 Azure 的功能现已正式发布
  6. 年轻人如何做好自己的人生规划?
  7. 面试分享:那些年我经历过的一些面试,以及得到的一些面试心得!
  8. 速来领取!降本增效的车间管理大屏,车间主任看了都拍手称好
  9. 一辈子的礼物56ay长沙论坛
  10. OpenEIM以前在合作伙伴做的时候