天天看點

根據IP擷取當地天氣

需求:根據IP擷取當地天氣

參考:http://news.qq.com/    其頁面中有擷取天氣的實作。

具體實作:1.檢視上面網頁,找出其相關代碼(我使用的是chrom浏覽器,F12調出調試模式)

2.解釋主要代碼:

(1)<script src="http://fw.qq.com:80/ipaddress"></script> :加載這個js,傳回的資訊:var IPData = new Array("60.29.153.39","","天津市","");

其傳回的是本機的IP和地區(類似山東省,濟南市;因為天津是直轄市比較特殊,最後市為空;後面有專門判斷)。

注意:http://fw.qq.com:80/ipaddress現在打不開,可以找搜狐的相關的位址,傳回資訊有點不一樣,但是基本資訊都在的。可以參考的有(

國家氣象局提供的天氣預報接口位址: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;

搜狐的位址:http://pv.sohu.com/cityjson?ie=utf-8)

(2)<div id="weatherWrap">

<span id="echoData"></span>

<span id="echoWeek"></span>

<span id="wCity"></span>

<span id="weatherIco"></span>

<span id="wTp"></span>

</div>  

主要是設定顯示資訊;具體的操作在下面的js中。

(3)<script type="text/javascript">

...............................

   document.getElementById("echoWeek").innerHTML = "星期"+sMday[sTime2];

   document.getElementById("echoData").innerHTML = sTime1;

</script>

設定時間的部分,比較簡單,不在多說了

(4)<script src="http://news.qq.com/newsweather/showWeather.js" type="text/javascript"></script>這個js裡面是主要的處理天氣的部分:

首有城市與城市ID對應關系;

然後根據(1)中地區擷取相應的城市ID;

 再次,根據位址:'http://weather.gtimg.cn/city/' + cityId + '.js?ref=qqnews';傳回的資訊是這個地區的各種資訊(天氣,溫度,等)

最後,根據上步取出所需要的資訊即可。

繼續閱讀