在360天气查询时,可以获取到响应中的跨域数据接口文件,其中包含的是获取的城市的天气情况,可以利用城市Id值得不同,利用的地址,动态获取不同城市的天气情况。
例如:通过360的获取到的广州的天气情况
思路:通过城市的ID的改变,利用jQuery的$.ajax方法实现跨域请求。城市的ID是一个变量,在成功接收文件的回调函数中得数据,分别找出未来的天气情况,然后动态添加到DOM树上。
- HTML:简单列出几个城市,css样式省略
复制代码
- js部分
复制代码
效果图
小结:利用了jQuery的一个跨域方法实现简单的跨域请求,实时查询城市天气。关键的是利用不同城市的ID跨域请求到相应的城市天气数据,然后从获取到的数据中,提取出要展示的信息,添加到DOM树上。