注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

{'coding': 'life'}

          I want to be a geek

 
 
 

日志

 
 
 
 

【引用】Js 获取“中国天气”网天气  

2011-03-04 01:30:11|  分类: 前端 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
本文转载自稻子生活 《Js 获取“中国天气”网天气》

QQ天气预报不准确,因此就从中国天气网上获取数据。中国天气网网址:

http://www.weather.com.cn/

在该网页最上方有一个查询功能,在里面输入城市名称,比如无锡,网页重定向到:

http://www.weather.com.cn/html/weather/101190201.shtml?

该网址中的101190201便是无锡的城市代号,获取到这个号码后,便打开网址:

http://m.weather.com.cn/data/101190201.html

该页面中显示的便是无锡市的天气情况核心数据,我们可以通过解析该数据而获取到当天及今后7天的气温、天气、风向等气象信息。如果要获取别的城市天气,只需修改该网址中的城市代号即可。

 

该网页显示内容如下:

{"weatherinfo":{"city":"无锡","city_en":"wuxi","date_y":"2010年3月15日","date":"庚寅年正月三十","week":"星期一","fchh":"11","cityid":"101190201","temp1":"12℃~4℃","temp2":"13℃~4℃","temp3":"14℃~5℃","temp4":"16℃~8℃","temp5":"24℃~12℃","tempF1":"53.6℉~39.2℉","tempF2":"55.4℉~39.2℉","tempF3":"57.2℉~41℉","tempF4":"60.8℉~46.4℉","tempF5":"75.2℉~53.6℉","weather1":"小雨转阴","weather2":"多云","weather3":"多云","weather4":"多云","weather5":"多云","img1":"7","img2":"2","img3":"1","img4":"99","img5":"1","img6":"99","img7":"1","img8":"99","img9":"1","img10":"99","img_single":"7","img_title1":"小雨","img_title2":"阴","img_title3":"多云","img_title4":"多云","img_title5":"多云","img_title6":"多云","img_title7":"多云","img_title8":"多云","img_title9":"多云","img_title10":"多云","img_title_single":"小雨","wind1":"西北风4-5级转北风3-4级","wind2":"南风3-4级","wind3":"南风3-4级","wind4":"南风3-4级","wind5":"南风3-4级","fx1":"西北风","fx2":"北风","fl1":"4-5级转3-4级","fl2":"3-4级","fl3":"3-4级","fl4":"3-4级","fl5":"3-4级","index":"温凉","index_d":"建议着夹衣或西服套装加薄羊毛衫等春秋服装。年老体弱者宜着夹衣或风衣加羊毛衫。","index48":"温凉","index48_d":"建议着夹衣或西服套装加薄羊毛衫等春秋服装。年老体弱者宜着夹衣或风衣加羊毛衫。","index_uv":"最弱","index48_uv":"最弱","index_xc":"不宜","index_tr":"适宜","index_co":"较舒适","st1":"9","st2":"0","st3":"12","st4":"2","st5":"13","st6":"3"}}

 

其中粉红色部分是气温数据,temp1表示当天气温是12-4℃,temp2表示第二天的气温,以此类推;蓝色部分是天气情况,weather1表示当天天气是小雨转阴,weather2表示第二天的天气,以此类推;棕色部分是风向和风力数据,wind1表示当天的风向和风力,wind2表示第二天的风向和风力,以此类推。这些数据完全可以通过js解析字符串而得到,解析代码见下文。

 

在程序中获取这段数据,只需获取到http://m.weather.com.cn/data/101190201.html这个网页的内容即可,因此必须使用到ajax技术;同时在自己的空间访问中国天气网站,属于跨域请求,而ff或safari不支持跨域请求,因此只能通过具备远程访问能力的中间件,比如vbscript、java、php或c#,即只能通过服务器来远程访问该网页,获取到网页内容后,再由ajax访问自己站上的中间件获取到天气数据并通过js解析。

 

下面的代码以asp为例:

Remote.asp内容如下(这段代码是利用vbscript访问远程服务器,并获取网页内容):

<%

       function getHTTPPage(url)

              dim Http

              set Http=server.createobject("MSXml2.XmlHTTP")

              Http.open "GET",url,false

              Http.send()

              if Http.readystate<>4 then

                     exit function

              else   

                 If Http.status=200 Then

                        'response.write replace(BytesToBstr(http.responseBody,"gb2312"),chr(10),"")

                 End If

              end if

              getHTTPPage=bytesToBSTR(Http.responseBody,"UTF-8")

              'getHTTPPage=Http.responseBody

              set http=nothing

              if err.number<>0 then err.Clear

       end function

       Function BytesToBstr(body,Cset)'转换代码,不然全是乱码

              dim objstream

              set objstream = Server.CreateObject("adodb.stream")

              objstream.Type = 1

              objstream.Mode =3

              objstream.Open

              objstream.Write body

              objstream.Position = 0

              objstream.Type = 2

              objstream.Charset = Cset

              BytesToBstr = objstream.ReadText

              objstream.Close

              set objstream = nothing

       End Function

      

       Dim Url,Html,Usg,id

    id=Request("id")

    Url="http://m.weather.com.cn/data/101190201.html"

    Html = getHTTPPage(Url)

       response.Charset="GB2312"

    Response.write Html

       '此代码修改自http://www.stubc.com/thread-465-1-3.html

%>

 

下面是wea.js中的内容(这段代码是利用ajax异步请求remote.asp,获取到天气情况,并利用js解析数据):

// JavaScript Document

 

       //id是呈现天气内容的div或span

       var Weather = function(id){

              var http_request = null;

           function send_request(url, method) {

                  http_request = null;

                  if(window.XMLHttpRequest) { //Mozilla 浏览器

                            http_request = new XMLHttpRequest();

                            if (http_request.overrideMimeType) {//设置MiME类别

                                  http_request.overrideMimeType('text/xml');

                            }

                   } else if (window.ActiveXObject) { // IE浏览器

                            try {

                                  http_request = new ActiveXObject("Msxml2.XMLHTTP");

                            } catch (e) {

                                  try {

                                         http_request = new ActiveXObject("Microsoft.XMLHTTP");

                                  } catch (e) {}

                            }

                   }

                   if (!http_request) { // 异常,创建对象实例失败

                            window.alert("不能创建XMLHttpRequest对象实例.");

                            return false;

                    }

                    

                   http_request.onreadystatechange = method;

                    http_request.open("GET", url, true);

                   http_request.send(null);

             }

              var url = "remote.asp?timestampt=" + new Date();

              send_request(url, callbackGetSource);

              function callbackGetSource(){

                     if (http_request.readyState == 4) {

                            if (http_request.status == 200) {

                                   var tem = http_request.responseText

                            var wea = analyze(tem);

                            if(wea != null){

                                   var node = document.getElementById(id);

                                   node.innerHTML = wea.temp + "&nbsp;" + wea.weather + "&nbsp;" + wea.wind;

                            }

                            } else { //页面不正常

                                   alert("您所请求的页面有异常。");

                            }

                     }

              }

              function analyze(tem){

                     if(tem == null)return null;

                     var temp, weather, wind

                     temp = getValue(tem, "temp1");

                     weather = getValue(tem, "weather1");

                     wind = getValue(tem, "wind1");

                     return {temp: temp, weather: weather, wind: wind};

              }

              function getValue(info, prmName){

                     var len = prmName.length;

                     var dex = info.indexOf(prmName);

                     var tem = info.substring(dex + len + 3);

                     dex = tem.indexOf('"');

                     return tem.substring(0, dex);

              }

       }

 

下面是html页面:

<script src="../js/wea.js" type="text/javascript"></script>

<div class="loginfont1" id="weather_content">晴 北风4-5级 湿度:41%</div>

<script language="javascript">

       new Weather("weather_content");

  </script>

  评论这张
 
阅读(532)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2018