想做个直接通过JS获取某个城市的天气。本来想通过直接调用中国气象网的接口:
http://www.weather.com.cn/weather/101070201.shtml,但是跨域问题一直无法解决,有谁知道请告诉我。因而改调用腾讯接口,部分源码如下:
function Weather() {}; Weather.prototype = { getWeather: function (city, callback) { var that = this, cities = Weather.cityParse(), code = cities[city] ? cities[city] : 125, // 默认使用北京城市 url = 'http://mat1.qq.com/weather/inc/minisite2_' + code + '.js'; // 腾讯天气API jsonp接口 this.createJsonp(url, function (para) { var desc = that.weatherParse(para); // 通过jsonp获取天气相关信息 callback(desc); }); }, // jsonp 17 createJsonp: function (url, callback) { var script = document.createElement('script'); script.type = 'text/javascript'; script.src = url; script.onreadystatechange = function () { if (script.readyState === 'loaded' || script.readyState === 'complete') { callback(__minisite2__weather__); script.onreadystatechange = null; script.onload = null; } }; script.onload = function () { callback(__minisite2__weather__); script.onreadystatechange = null; script.onload = null; }; document.body.appendChild(script); }, weatherParse: function (para) { try { var params = para.split(' '); var weather = { city: params[0], temperature: params[1], range: params[2], describe: params[3] }; return weather; } catch (e) { } } }; // 将城市及其对应代码解析成hash形式 Weather.cityParse = function () { var cities = {}, prop, code, item; for (prop in this.city) { item = Weather.city[prop]; for (var city in item) { if (city !== '_') { code = item[city]; city = city.slice(0, -1); cities[city] = code; } } } return cities; }; Weather.city = { "北京市": { "_": 125, "北京市": 125 }, "上海市": { "_": 252, "上海市": 252 }, "天津市": { "_": 127, "天津市": 127, "塘沽区": 132 }, "重庆市" : { "_": 212, "奉节区": 201, "重庆市": 212, "涪陵区": 213 }, "香港": { "_": 1, "香港": 1 }, "澳门": { "_": 2, "澳门": 2 }, "台湾省": { "_": 280, "台北市": 280 }, "云南省": { "_": 179, "昭通市": 173, "丽江市": 174, "曲靖市": 175, "保山市": 176, "大理州": 177, "楚雄州": 178, "昆明市": 179, "瑞丽市": 180, "玉溪市": 181, "临沧市": 182, "思茅市": 184, "红河州": 185, "文山州": 369, "西双版纳州": 370, "德宏州": 371, "怒江州": 372, "迪庆州": 373 }, "内蒙古": { "_": 69, "呼伦贝尔市": 4, "兴安盟": 7, "锡林郭勒盟": 16, "巴彦淖尔市": 63, "包头市": 64, "呼和浩特市": 69, "锡林浩特市": 99, "通辽市": 101, "赤峰市": 106, "乌海市": 382, "鄂尔多斯市": 383, "乌兰察布市": 384 } }; // 主要是些事件处理相关的方法包装147var Util = {148 addEvent: function (element, type, handler) { if (element.addEventListener) { element.addEventListener(type, handler, false); } else if (element.attachEvent) { element.attachEvent('on' + type, handler); } }, getEvent: function (event) { return event || window.event; }, getTarget: function (event) { return event.target || event.srcElement; }, getComputedStyle: function (element) { if (element.currentStyle) { return element.currentStyle; } else { return document.defaultView.getComputedStyle(element, null); } }, getBoundingClientRect: function (element) { var scrollTop = document.documentElement.scrollTop; var scrollLeft = document.documentElement.scrollLeft; if (element.getBoundingClientRect) { if (typeof arguments.callee.offset != 'number') { var temp = document.createElement('div'); temp.style.cssText = 'position: absolute; left: 0; top: 0;'; document.body.appendChild(temp); arguments.callee.offset = -temp.getBoundingClientRect().top - scrollTop; document.body.removeChild(temp); temp = null; } var rect = element.getBoundingClientRect(); var offset = arguments.callee.offset; return { left: rect.left + offset, rigth: rect.right + offset, top: rect.top + offset, bottom: rect.bottom + offset }; } else { var offset = this.getElementOffset(element); return { left: offset.left - scrollLeft, right: offset.left + element.offsetWidth - scrollLeft, top: offset.top - scrollTop, bottom: offset.top + element.offsetWidth - scrollTop }; } }, getElementOffset: function (element) { var actualLeft = element.offsetLeft; var actualTop = element.offsetTop; var current = element.offsetParent; while (current !== null) { actualLeft += current.offsetLeft; actualTop += current.actualTop; current = current.offsetParent; } return { left: actualLeft, top: actualTop }; } };
没有回复内容