自己寫的一個天氣查詢應用


俗話說得好:弱,就得多練!

【想法來源】

為了多鍛煉自己,我開始寫這個小玩意,之前逛聚合數據這個網站的時候,發現他有個天氣的API,我就想寫個可以用的小應用。所以花了一個晚上東平西湊總算搞出來了。

【技術基礎】

我的網站用了riotJs這個框架,所以在展示數據的時候會方便點(不知道什么是riotJS的可以看這里)但是那個跟這篇文章沒關系;我主要介紹一些開發中比較有用的東西。

【正文】

1、rainyday.js

一開始本來想選一張好看點的圖片做背景,但是總感覺少了什么,我想既然是天氣,那就來個下雨效果吧,所以就用了這個;使用方法見官網吧,我也是按照那個來的,我就是調整了下參數。

2、URI二次轉碼

天氣api需要兩個參數,一個是key,這個是開發中獨有的,你們不用管,另一個就是cityname,一開始請求成功但是總是顯示cityname出錯查找不到城市,當時心想妹的這個城市都找不到,后來才發現發送過去的參數中cityname變了樣,譬如我輸入'溫州',本來應該是這個樣子的:

%E6%B8%A9%E5%B7%9E

,但是發送過去的數據變成這樣了:

%25E6%25B8%25A9%25E5%25B7%259E

這說明二次轉碼了,解決辦法就是:

tianqiData.cityname = decodeURI(encodeURI(tianqiData.cityname));

(不用管變量名,這個是我從我源碼中拷貝出來的)  

3、input的outline

在使用背景圖片后,再用input文本類型的標簽,鼠標點擊會出現一個亮框,好丑。這時候只要給input設置這個樣式:

outline: none;

 【效果圖】

【應用網址】

天氣應用

 有不好的地方可以跟我反饋


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM