Chinaunix首页 | 论坛 | 博客

IT民工窝棚qbq.blog.chinaunix.net

首页　| 　博文目录　| 　关于我

qbq

  • 博客访问： 30479086
  • 博文数量： 708
  • 博客积分： 12163
  • 博客等级： 上将
  • 技术积分： 8240
  • 用 户 组： 普通用户
  • 注册时间： 2007-12-04 20:59
文章分类

全部博文（708）

推荐博文
相关博文
AJAX跨域访问之天气预报

分类： 系统运维

2012-07-18 21:43:19


点击(此处)折叠或打开

  1. <!DocType html>
  2. <html>
  3. <head>
  4. <br>
  5. <meta charset="utf-8">
  6. <script type="text/javascript" src="">
  7. </script><script type="text/javascript">
  8.   google.load("search", "1");
  9.   google.load("jquery", "1.4.2");
  10.   google.load("jqueryui", "1.7.2");
  11. </script>
  12. <script type="text/javascript">
  13. function loadXMLDoc(url) {
  14.     $.get(url// + '&t=' + Math.random()
  15.     ,

  17.     function (data, textStatus){
  18.     
  19.         $('#weather').html('');
  20.         
  21.         var weather = data.getElementsByTagName("weather")[0];
  22.         var forecast_information = weather.getElementsByTagName("forecast_information")[0];
  23.         var citytag = forecast_information.getElementsByTagName("city")[0];
  24.         var city = citytag.getAttribute("data");
  25.         $('#city').html(city);
  26.         
  27.         var current_conditions = weather.getElementsByTagName("current_conditions")[0];
  28.         
  29.         var conditiontag = current_conditions.getElementsByTagName("condition")[0];
  30.         var condition = conditiontag.getAttribute("data");
  31.         $('#condition').html(condition);
  32.         
  33.         var temp_ctag = current_conditions.getElementsByTagName("temp_c")[0];
  34.         var temp_c = temp_ctag.getAttribute("data");
  35.         $('#temp_c').html('温度： ' + temp_c);
  36.         
  37.         var humiditytag = current_conditions.getElementsByTagName("humidity")[0];
  38.         var humidity = humiditytag.getAttribute("data");
  39.         $('#humidity').html(humidity);
  40.         
  41.         var wind_conditiontag = current_conditions.getElementsByTagName("wind_condition")[0];
  42.         var wind_condition = wind_conditiontag.getAttribute("data");
  43.         $('#wind_condition').html(wind_condition);
  44.         
  45.         
  46.         var forecast_conditions = weather.getElementsByTagName("forecast_conditions");
  47.         var forecast_conditions_txt = '';
  48.             forecast_conditions_txt += '
    49. ';
  49.         var i = 0;
  50.         for (i = 0;i < forecast_conditions.length; i++) {
  51.             var day_of_weektag = forecast_conditions[i].getElementsByTagName("day_of_week")[0];
  52.             var day_of_week = day_of_weektag.getAttribute("data");
  53.             var lowtag = forecast_conditions[i].getElementsByTagName("low")[0];
  54.             var low = lowtag.getAttribute("data");
  55.             var hightag = forecast_conditions[i].getElementsByTagName("high")[0];
  56.             var high = hightag.getAttribute("data");
  57.             var icontag = forecast_conditions[i].getElementsByTagName("icon")[0];
  58.             var icon = "" + icontag.getAttribute("data");
  59.             var conditiontag = forecast_conditions[i].getElementsByTagName("condition")[0];
  60.             var condition = conditiontag.getAttribute("data");
  61.             forecast_conditions_txt += '
    62. ';
  62.         }
  63.         forecast_conditions_txt += '
    64. 日期低温高温天气
    ' + day_of_week + '' + low + '' + high + '' + condition + '+ icon + '" />
    '    ;
  64.         $('#weather').html(forecast_conditions_txt);
  65.     });
  66. }
  67. </script>
  68. </br>
  69. </head>
  70. <body onload="loadXMLDoc('/ig/api?hl=zh-cn&weather=Dalian')">
  71. <p id="city"></p>
  72. <p id="condition"></p>
  73. <p id="temp_c"></p>
  74. <p id="humidity"></p>
  75. <p id="wind_condition"></p>
  76. <div id="weather">
  77. </div>
  78. <button onclick="loadXMLDoc('/ig/api?hl=zh-cn&weather=Dalian')">更新</button>

  80. </body>
  81. </html>

阅读(2237) | 评论(0) | 转发(0) |
0

上一篇：触发click事件

下一篇：JavaScript获取光标位置

给主人留下些什么吧！~~
关于我们 | 关于IT168 | 联系方式 | 广告合作 | 法律声明 | 免费注册

Copyright 2001-2010 ChinaUnix.net All Rights Reserved 北京皓辰网域网络信息技术有限公司. 版权所有

感谢所有关心和支持过ChinaUnix的朋友们

16024965号-6