浏览器由于安全方面的问题，禁止ajax跨域请求其他网站的数据，但是可以再本地的服务器上获取其他服务器的信息，在通过ajax请求本地服务来实现：
<?php header("content-type:text/html;charset=utf-8"); //php代理获取天气信息 //跨域请求 //天气预报接口 $url = "http://www.weather.com.cn/data/sk/101010100.html"; $cont = file_get_contents($url); echo $cont; ?>
使用原生JS来实现：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" > <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/> <title>ajax</title> <style type="text/css"> </style> <script type="text/javascript"> function getWeather(){ var xhr = new XMLHttpRequest(); var s = ""; xhr.onreadystatechange = function(){ if(xhr.readyState==4){ alert(xhr.responseText); eval("var info="+xhr.responseText); s += "城市："+info.weatherinfo.city+" "; s += "温度："+info.weatherinfo.temp+" "; s += "风向："+info.weatherinfo.WD+" "; s += "风力："+info.weatherinfo.WS; } document.getElementById("weather").innerHTML = s; } xhr.open('get','./weather.php'); xhr.send(null); //阻止浏览器默认动作 跳转 return false; } </script> </head> <body> <h2>ajax无刷新获取天气信息</h2> <input type="submit" value="获取天气" onclick="getWeather()"></input> <div id="weather"></div> <hr/> <iframe width="420" scrolling="no" height="60" frameborder="0" allowtransparency="true" src="http://i.tianqi.com/index.php?c=code&id=12&icon=1&num=5"></iframe> </body> </html>
使用jq的ajax来实现：
<!doctype html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>标题</title> <meta name="Keywords" content=""> <meta name="Description" content=""> </head> <body> <div class='div'></div> <input type='button' class='submit' value='提交' /> <script type='text/javascript' src='jquery-1.8.3.min.js'></script> <script type='text/javascript'> $('input.submit').click(function(){ $.ajax({ url:"weather.php", async:true, success:function(result){ eval("var info="+result); console.log(info['weatherinfo']['city']); } }); }); </script> </body> </html>
获取天气预报的信息：开源免费天气预报接口API以及全国所有地区代码！！（国家气象局提供）
国家气象局提供的天气预报接口
接口地址：
http://www.weather.com.cn/data/sk/101010100.html
http://www.weather.com.cn/data/cityinfo/101010100.html
http://m.weather.com.cn/data/101010100.html
对于第三个接口，返回信息比较全面，也是以json格式提供，格式如下
{"weatherinfo": {
//基本信息;
"city":"北京","city_en":"beijing",
"date_y":"2012年2月16日","date":"", "week":"星期四","fchh":"11", "cityid":"101010100",
//摄氏温度
"temp1":"2℃~-7℃",
"temp2":"1℃~-7℃",
"temp3":"4℃~-7℃",
"temp4":"7℃~-5℃",
"temp5":"5℃~-3℃",
"temp6":"5℃~-2℃",
//华氏温度;
"tempF1":"35.6℉~19.4℉",
"tempF2":"33.8℉~19.4℉",
"tempF3":"39.2℉~19.4℉",
"tempF4":"44.6℉~23℉",
"tempF5":"41℉~26.6℉",
"tempF6":"41℉~28.4℉",
//天气描述;
"weather1":"晴",
"weather2":"晴",
"weather3":"晴",
"weather4":"晴转多云",
"weather5":"多云",
"weather6":"多云转阴",
//天气描述图片序号
"img1":"0",
"img2":"99",
"img3":"0",
"img4":"99",
"img5":"0",
"img6":"99",
"img7":"0",
"img8":"1",
"img9":"1",
"img10":"99",
"img11":"1",
"img12":"2",
"img_single":"0",
//图片名称;
"img_title1":"晴",
"img_title2":"晴",
"img_title3":"晴",
"img_title4":"晴",
"img_title5":"晴",
"img_title6":"晴",
"img_title7":"晴",
"img_title8":"多云",
"img_title9":"多云",
"img_title10":"多云",
"img_title11":"多云",
"img_title12":"阴",
"img_title_single":"晴",
//风速描述
"wind1":"北风3-4级转微风",
"wind2":"微风",
"wind3":"微风",
"wind4":"微风",
"wind5":"微风",
"wind6":"微风",
//风速级别描述
"fx1":"北风",
"fx2":"微风",
"fl1":"3-4级转小于3级",
"fl2":"小于3级",
"fl3":"小于3级",
"fl4":"小于3级",
"fl5":"小于3级",
"fl6":"小于3级",
//今天穿衣指数;
"index":"冷",
"index_d":"天气冷，建议着棉衣、皮夹克加羊毛衫等冬季服装。年老体弱者宜着厚棉衣或冬大衣。",
//48小时穿衣指数
"index48":"冷",
"index48_d":"天气冷，建议着棉衣、皮夹克加羊毛衫等冬季服装。年老体弱者宜着厚棉衣或冬大衣。",
//紫外线及48小时紫外线
"index_uv":"弱",
"index48_uv":"弱",
//洗车
"index_xc":"适宜",
//旅游
"index_tr":"一般",
//舒适指数
"index_co":"较不舒适",
"st1":"1",
"st2":"-8",
"st3":"2",
"st4":"-4",
"st5":"5",
"st6":"-5",
//晨练
"index_cl":"较不宜",
//晾晒
"index_ls":"基本适宜",
//过敏
"index_ag":"极不易发"}}
全国各城市代码如下：
北京:101010100朝阳:101010300顺义:101010400怀柔:101010500通州:101010600昌平:101010700延庆:101010800丰台:101010900石景山:101011000大兴:101011100房山:101011200密云:101011300门头沟:101011400平谷:101011500八达岭:101011600佛爷顶:101011700汤河口:101011800密云上甸子:101011900斋堂:101012000霞云岭:101012100北京城区:101012200海淀:101010200天津:101030100宝坻:101030300东丽:101030400西青:101030500北辰:101030600蓟县:101031400汉沽:101030800静海:101030900津南:101031000塘沽:101031100大港:101031200武清:101030200宁河:101030700上海:101020100宝山:101020300嘉定:101020500南汇:101020600浦东:101021300青浦:101020800松江:101020900奉贤:101021000崇明:101021100徐家汇:101021200闵行:101020200金山:101020700石家庄:101090101张家口:101090301承德:101090402唐山:101090501秦皇岛:101091101沧州:101090701衡水:101090801邢台:101090901邯郸:101091001保定:101090201廊坊:101090601郑州:101180101新乡:101180301许昌:101180401平顶山:101180501信阳:101180601南阳:101180701开封:101180801洛阳:101180901商丘:101181001焦作:101181101鹤壁:101181201濮阳:101181301周口:101181401漯河:101181501驻马店:101181601三门峡:101181701济源:101181801安阳:101180201合肥:101220101芜湖:101220301淮南:101220401马鞍山:101220501安庆:101220601宿州:101220701阜阳:101220801亳州:101220901黄山:101221001滁州:101221101淮北:101221201铜陵:101221301宣城:101221401六安:101221501巢湖:101221601池州:101221701蚌埠:101220201杭州:101210101舟山:101211101湖州:101210201嘉兴:101210301金华:101210901绍兴:101210501台州:101210601温州:101210701丽水:101210801衢州:101211001宁波:101210401重庆:101040100合川:101040300南川:101040400江津:101040500万盛:101040600渝北:101040700北碚:101040800巴南:101040900长寿:101041000黔江:101041100万州天城:101041200万州龙宝:101041300涪陵:101041400开县:101041500城口:101041600云阳:101041700巫溪:101041800奉节:101041900