非框架的js天气预报代码！可完全自己定义样式~

先上图：


以上是我自己修改过的效果。此天气预报代码的天气源来自新浪，源代码来自网络~致敬！天气信息由js输出并且已解决与discuz程序冲突的问题。
首先确定你的页面有加载jquery1.7.2,如果没有，那么请加上

1. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

复制代码

1. <script type="text/javascript" src="weather.js" language="javascript" charset="UTF-8"></script>

复制代码

weather.js见附件，注意此文件的路径为你自己的路径。然后在需要加上天气预报代码的地方加上代码：
<div class="sfweather">

1. <table width="100%" border="0" cellspacing="0" cellpadding="0" class="weather">
   
2.   <tr>
   
3.     <td style="width: 64px;padding-right: 16px;"><div class="wtimg" id="T_weather_img"></div></td>
   
4.     <td><div class="wtcon">
   
5.         <span class="city"></span>
   
6.         <span id="T_weather"></span>
   
7.         <span id="T_temperature"></span>
   
8.         </div></td>
   
9.     <td><div class="wtdate">
   
10.             <span id="T_Date"></span>
    
11.         <span id="T_Day"></span>
    
12.         </div></td>
    
13.   </tr>
    
14. </table>
    
15. </div>

复制代码

所有的天气相关信息是通过id来遍历之后输出的，所以不要有其它的与之冲突。如果需要，你可以任意调整id为T_weather_img,T_weather,T_temperature,T_Date,T_Day等span标签的位置。
注意css部分为：

1. /*天气*/
   
2. .sfweather { width:196px; background:#009ad9; padding:4px 12px;margin: 8px auto;}
   
3. .sfweather span {color: white;}
   
4. .wtimg img{width: 64px;height: 64px;}
   
5. .city { font-size:18px; margin-bottom:4px;line-height: 18px;}
   
6. .wtcon span {display: block;}
   
7. .wtdate{text-align:center;}
   
8. .wtdate span {display: block;}
   
9. #T_weather,#T_temperature{font-size: 12px;margin-bottom: 1px;line-height:12px}
   
10. #T_Date {font-size:18px;line-height: 18px;}
    
11. #T_Day {font-size: 36px;line-height: 36px;}

复制代码

最后附上weather.js：（赚点辛苦费~{:soso_e113:}）

整理by：SFNav科幻导航站长，我的小站地址www.sfnav.com(也是演示地址).有不对劲的可以跟帖询问，应用此代码前请做好备份。

感觉还不错！支持一个！http://www.asigruel.com/

钱！！！

cancer_zml 发表于 2012-11-2 17:10
钱！！！

什么钱？

这是好东西，我找了很久，楼主发一个给我用一下，我没得金币。

好东西,顶一下,哥们qq是多少?加好友

站不错！

装上的效果 www.kiss024.com

要放那个位置？？

www.fqschool.com

好像不会用