欢迎光临 - 我的站长站,本站所有资源仅供学习与参考,禁止用于商业用途或从事违法行为!

js教程

免费分享一个天气Api接口(附使用示例)

js教程 我的站长站 2019-05-28 共168人阅读

网上的大多数天气接口要么是收费的,要么只支持 iframe 嵌入方式,根本就没法用……

今天“不小心”从 360 那挖到了一个支持 JSON 的天气接口,支持自动判断地区,获取最近五天的天气,支持天气相关信息展示。非常好用!

接口请求格式如下:

http://cdn.weather.hao.360.cn/sed_api_weather_info.php?app=360chrome&code=【地区编码】&_jsonp=【jsonp回调函数】

其中的 地区编码 与中国天气网的地区编码是一样的。如果不设置这个参数,则默认显示本地的天气状况。

简易的调用示例源码如下:(请自行进行界面美化)

<!DOCTYPE html>
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html; charset=UTF-8"/>
<title>天气接口使用示例</title>
<style>
body {  
font-family: microsoft yahei;  
}  
</style>
<scriptsrc="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
</head>
<body>
<divid="output"></div>
<scripttype="text/javascript"charset="utf-8">
$.ajax({  
type: "GET",   
url: "http://cdn.weather.hao.360.cn/sed_api_weather_info.php?app=360chrome",  
dataType : "jsonp",  
jsonp: "_jsonp",//参数名  
success: function(jsonData){  
var html;  
html= '数据更新时间:'+ jsonData.pubdate + ' ' + jsonData.pubtime + '<br>';  
html += '地区:' + jsonData.area[0][0] + ' ' + jsonData.area[1][0] + ' ' + jsonData.area[2][0] + '<br>';  
html += '天气情况:<br>';  
for(var i=0; i<jsonData.weather.length; i++) {  
html += jsonData.weather[i].date + '<br>';  
if(jsonData.weather[i].info.dawn !== undefined) {  
html += '早晨天气:' + jsonData.weather[i].info.dawn[1] +   
' 气温:' + jsonData.weather[i].info.dawn[0] + '~' + jsonData.weather[i].info.dawn[2] + '℃ ' +  
jsonData.weather[i].info.dawn[3] +' '+ jsonData.weather[i].info.dawn[4] + '<br>';  
}  
if(jsonData.weather[i].info.day !== undefined) {  
html += '白天天气:' + jsonData.weather[i].info.day[1] +   
' 气温:' + jsonData.weather[i].info.day[0] + '~' + jsonData.weather[i].info.day[2] + '℃ ' +  
jsonData.weather[i].info.day[3] +' '+ jsonData.weather[i].info.day[4] + '<br>';  
}  
if(jsonData.weather[i].info.night !== undefined) {  
html += '夜间天气:' + jsonData.weather[i].info.night[1] +   
' 气温:' + jsonData.weather[i].info.night[0] + '~' + jsonData.weather[i].info.night[2] + '℃ ' +  
jsonData.weather[i].info.night[3] +' '+ jsonData.weather[i].info.night[4] + '<br>';  
}  
html += '<br>';  
}  
html += '穿衣:<br>';  
html += '【' + jsonData.life.info.chuanyi[0] + '】 ' + jsonData.life.info.chuanyi[1] + '<br><br>';  
html += '感冒:<br>';  
html += '【' + jsonData.life.info.ganmao[0] + '】 ' + jsonData.life.info.ganmao[1] + '<br><br>';  
html += '空调:<br>';  
html += '【' + jsonData.life.info.kongtiao[0] + '】 ' + jsonData.life.info.kongtiao[1] + '<br><br>';  
html += '污染:<br>';  
html += '【' + jsonData.life.info.wuran[0] + '】 ' + jsonData.life.info.wuran[1] + '<br><br>';  
html += '洗车:<br>';  
html += '【' + jsonData.life.info.xiche[0] + '】 ' + jsonData.life.info.xiche[1] + '<br><br>';  
html += '运动:<br>';  
html += '【' + jsonData.life.info.yundong[0] + '】 ' + jsonData.life.info.yundong[1] + '<br><br>';  
html += '紫外线:<br>';  
html += '【' + jsonData.life.info.ziwaixian[0] + '】 ' + jsonData.life.info.ziwaixian[1] + '<br><br>';  
html += 'PM2.5: ' + jsonData.pm25.pm25[0];  
$("#output").html(html);  
}  
});  
</script>
</body>
</html>
相关专题
API
API
2022-06-15 113

API是开发中必备知识点,合理的应用API可以大大节省开发成本,为您整理收集了包含API接口的信息,包含API接口,API代码,API源码,助你更快的学习使用API技术....

标签 jsapiJS请求
相关推荐
  • jsapi
  • JS请求
  • 无需任何Api的在线翻译功能

    今天分享一个 php 的翻译类模块,这个模块是之前在 thinkphp 的论坛里淘到的。小试了一下,效果非常不错!于是果断搬过来收藏。<?php // +----------------------------------------------------------------------// | PHP MVC FrameWork v1.0 在线翻译...

    js教程 184 4年前
  • 免费分享一个天气Api接口(附使用示例)

    网上的大多数天气接口要么是收费的,要么只支持 iframe 嵌入方式,根本就没法用……今天“不小心”从 360 那挖到了一个支持 json 的天气接口,支持自动判断地区,获取最近五天的天气,支持天气相关信息展示。非常好用!接口请求格式如下:http://cdn.weather.hao....

    js教程 168 4年前
  • 查询百度收录量API接口代码

    显示百度收录最新的网页收录数,还在到处查网页百度收录有没有添加吗,那你就落后了,现在都是直接在网页显示百度收录的最新数量。使用直接在要显示的地址添加以下代码即可。<div id="mli"></div><script type="text/javascript">var url = &#39;https://...

    js教程 254 3年前
  • 淘宝电话手机号归属地API查询接口

    淘宝电话手机号归属地API查询接口,返回数据如下接口是淘宝的,一直在用的,没有失效过,分享给需要的人,接口可以查询归属地和卡的类型等等的。接口地址https://tcc.taobao.com/cc/json/mobile_tel_segment.htm?tel=123456789...

    js教程 220 3年前
  • 免费的本地IP查询接口 附JS代码

    收藏自用的免费的本地IP查询API接口,都是大网站的接口稳定速度快。搜狐本机IP查询1:http://pv.sohu.com/cityjson搜狐本机IP查询2:http://txt.go.sohu.com/ip/soip搜狐本机IP查询(指定编码):http://pv.sohu.com/cityjson?ie=utf-8太平洋电脑网本机IP查询:ht...

    js教程 126 3年前
  • 分享一个QQ音乐刷音响力API接口和JS请求代码

    分享一个QQ音乐刷音响力API接口,免费的,可以直接刷满QQ音乐刷音响力API接口地址https://qqmusicsped-qqmusicsped-wvfmljwjpm.cn-hangzhou.fcapp.run?qq=直接在后面加上你的QQ号,在浏览器访问即可刷成功。另外想把接口分享给其他人使用的,可以制作成应用...

    js教程 572 8个月前
  • 免费分享一个天气Api接口(附使用示例)

    网上的大多数天气接口要么是收费的,要么只支持 iframe 嵌入方式,根本就没法用……今天“不小心”从 360 那挖到了一个支持 json 的天气接口,支持自动判断地区,获取最近五天的天气,支持天气相关信息展示。非常好用!接口请求格式如下:http://cdn.weather.hao....

    js教程 168 4年前