访问www.163.com，首页的栏目里有当地的天气预报。可以猜想，这里的天气预报，应该是根据来访者的ip判断其所在地给出当地的天气情况。问了一些朋友，也证实了这一点。项目里也需要天气预报这个小栏目，同事做过一个(从其他站点抓取的)，不过实现不了根据IP显示当地的天气情况，需要用户自行选择，而且抓取的站点属于小站….其可靠性值得怀疑。。所以就萌生了抓取网易的天气预报的想法。。。对页面进行分析。。发现显示天气预报的区域是一个IFrame，IFrame里嵌入了如下链接http: //news.163.com/util/position1.html，对这个地址访问直接跳转到另外一个链接http://news.163.com/weather/news/qx1/56294.html，此链接显示了天气情况,如图：
由此可以推测http://news.163.com/util/position1.html,是在根据来访者的IP判断所属区域，然后返回一个该地区所对应的区位码,如: 56294代表成都。如何让网易来帮我们的站点来访者判断所属区域，并给出天气情况，并显示在自己的站点页面上呢?还得继续分析。。因为http: //news.163.com/util/position1.html,此链接一访问就转向到天气情况的链接，而无法查看源码。便猜想。。此页面肯定有些东西。。无奈之下。。WebRequest一下,出现了如下代码:
| 以下是引用片段： 1<script language="Javascript"> 2var city = new Array("安徽","黑龙江","山东","北京","湖北","山西","福建","湖南","陕西","甘肃","吉林","上海","广东","江苏","四川","广西","江西","天津","贵州","辽宁","西藏","海南","内蒙古","新疆","河北","宁夏","云南","河南","青海","浙江","重庆"); 3var weaths = new Array('58321','50953','54823','54511','57494','53772','59134','57679','57036','52889','54172','58367','59287','58238','56294','59431','58606','54527','57816','54342','55591','52856','53463','51463','53698','53614','56778','57083','52866','58457','57516'); 4 5function getCookieVal (offset) { 6 var endstr = document.cookie.indexOf (";", offset); 7 if (endstr == -1) 8 endstr = document.cookie.length; 9 return unescape(document.cookie.substring(offset, endstr)); 10} 11function GetCookie (name) { 12 var arg = name + "="; 13 var alen = arg.length; 14 var clen = document.cookie.length; 15 var i = 0; 16 while (i < clen) { 17 var j = i + alen; 18 if (document.cookie.substring(i, j) == arg) 19 return getCookieVal (j); 20 i = document.cookie.indexOf(" ", i) + 1; 21 if (i == 0) 22 break; 23 } 24 return ""; 25} 26function SetCookie(cookieName,cookieValue,nDays) { 27 var today = new Date(); 28 var expire = new Date(); 29 if (nDays==null || nDays==0) nDays=1; 30 expire.setTime(today.getTime() + 3600000*24*nDays); 31 document.cookie = cookieName+"="+escape(cookieValue) + ";path=/;domain=.163.com;expires="+expire.toGMTString(); 32} 33function getCityWeatherID(cityname){ 34 for(i=0;i<city.length;i++){ 35 if(city[i]==cityname){ 36 return weaths[i]; 37 } 38 } 39 return "54511"; 40} 41 42var NTES_WeatherAddr = GetCookie("NTES_WeatherAddr"); 43if (!NTES_WeatherAddr){ 44 var loc = GetCookie("theaddr"); 45 if(!loc){ 46 document.write("<script type='text/javascript' src='http://202.108.39.152/ipquery'><" + "/script>"); 47 } 48} 49</script> 50<script> 51if (!NTES_WeatherAddr){ 52 NTES_WeatherAddr=getCityWeatherID(loc); 53} 54window.location.href="http://news.163.com/weather/news/qx1/"+NTES_WeatherAddr+".html"; 55</script> 56 57 |
上面的这段js实现了对来访者IP判断并给出了天气预报结果的链接。Js里的此链接: http://202.108.39.152/ipquery，起到的是判断用户所在地的作用，返回的是来访者所在地省份。分析到此，想要的结果差不多就出来了…
在客户端调用这段js获得天气预报结果的链接地址，然后交给服务端来处理。(为什么要交给后台处理，而不是直接显示呢?)因为直接得出的链接页面上，有多余的链接,还应用了样式(如图一),不便为自己所用，所以得处理掉。客户端调用服务端的方法很多，最初使用了Ajax框架Anthem，实现了过后，觉得有点杀鸡用牛刀的感觉。。无聊之余。。就又用CallBack实现了一次。。感觉恰到好处。。后来又发现。。__doPostBack也可以实现客户端调用服务端方法。。看来实现这么一个功能还真是简单。。。
好了到此就实现了，自己想要的结果:(感觉有点遗憾的是只给出了省会城市的天气预报)
 | 让错误也精彩！最新创意404页面设计(上) | 01-13 |
| 符合web标准的网页中调用Flash的方法 | 02-16 |
| 入门：学习网页Web标准的五个步骤 | 08-09 |
 | 在线网页设计制作实例：圣诞节网页 | 04-12 |
| 根据IP获取当地天气预报的实现 | 03-01 |
| 如何创建内容丰富的企业网站的网页 | 01-17 |
| 网页制作前台之Javascript鼠标事件 | 01-17 |
| Web制作的标准化实践 制作Google首页 | 01-17 |
| 在线网页设计制作实例：圣诞节网页 | 04-12 |
| 用菜单飞梭轻松制作漂亮的网页菜单 | 06-29 |
| 教你如何在自己的主页上制作P2P网络电视 | 06-01 |
| 解决列高度自适应(列高度相同)的五种方法 | 05-19 |
| [原文翻译]样式表编写效率手册 | 06-13 |
| 在线网页设计制作实例：圣诞节网页 | 42278 |
| 手把手教你打造一个asp动态网站 | 25296 |
| 入门：学习网页Web标准的五个步骤 | 7710 |
| 网页制作前台之Javascript鼠标事件 | 6821 |
| 用菜单飞梭轻松制作漂亮的网页菜单 | 6317 |
| 让错误也精彩！最新创意404页面设计(上) | 5948 |
| 拉菜单的简单制作 | 5830 |
| 设计自己的个性风格网站计数器 | 5813 |
