Ajax通过城市名获取数据（全国天气预报API)

预览图（比较简单粗糙)

聚合数据全国天气预报接口：https://www .何炬。cn/docs/API/id/39

接口地址：http://v.juhe.cn/weather/index支持格式：json/xml请求方式：获取请求示例：http://v.juhe.cn/weather/index？format=2cityname=苏州键=您申请的键调用样例及调试工具：美国石油学会测试工具请求参数说明：名称类型必填说明城市名称字符串Y城市名或城市身份证，如："苏州",需要utf8 urlencode数据类型字符串普通返回数据格式：json或xml，默认json格式int N未来6天预报（未来)两种返回格式，1或2,默认一个键串Y你申请的键

超文本标记语言部分代码：

！DOCTYPE html html lang=' en ' meta charset=' UTF-8 '标题天气预报/title脚本src=' http : jquery-2。1 .1 .量滴js '/脚本链接rel='样式表href=' w . CSS ' div id=' MF _ weather '脚本src=' http : w . js '/脚本按钮id=' search '天气查询/button输入id=' city ' type=' text ' value=' t body ' div class=' ctn ' div id='沐风/div div id=' future '/div/div/HTMl JAVAScript部分：

/** 1.输入城市名* 2,点击的时候发送请求* 3.响应成功渲染页面* */$(“# search”).on('click '，function(){var city=$('#city ').val()|| '北京；$citycode=urlencode(城市);URL=' http://v。何炬。cn/天气/指数？format=2城市名称=' $ city code ' key=c 82727 e 986 a4 f 6 CFC 6b a 1984 f1 f 9183 a '；$.ajax({url: url，dataType: 'jsonp '，type:'get '，data:{location:city}，success :函数(数据){ var sk=data。结果。sk；今日var数据。结果。今天；var future=数据。结果。未来；var fut='日期温度天气风向；$(' #沐风')。html('p ')当前： ' sk.temp '，' sk。风向sk。风强度'，'空气湿度sk。湿度，更新时间sk。time '/PP style=' padding-bottom : 10px；"今日城市"今天是今天：”。date _ y " "今天。星期" "今天。温度“今天”。天气“今天”。wind ' p/p ')；$(“# future”).html('p ')未来： '未来[0].温度',未来[0]。未来天气[0]。风',',更新时间未来[0]。未来一周[0]。日期'/PP style='填充-底部： 10px'今天。城市' p/p ')；} });});函数urlencode (str) { str=(str ' ').toString()；返回encodeURIComponent(字符串)。替换(/!/g，'！').替换(/'/g ').替换(/\(/g，'(').替换(/\)/g，')').替换(/\*/g，' *).替换(///g，")；} })

以上所述是小编给大家介绍的埃阿斯通过城市名获取数据（全国天气预报API)，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！