Posted on 2007-04-25 18:25
ZelluX 閱讀(560)
評論(0) 編輯 收藏 所屬分類:
Web
盡管是兩星期前完成的，不過還是養成好習慣，寫下心得吧
1. 工具方面，Firebug真不錯，大大提高了開發速度。IE的Developer Toolbar界面倒不錯，不過好像穩定性不高，經常crash。
2. 在用js判斷用戶注冊時，遇到驗證成功后再次驗證就會失敗的問題。原因在于開啟了正則表達式global選項，在第一次匹配后，檢測指針會指向最后一個換行符，于是第二次檢測就會失敗。
3. CSS的級聯特性很方便，只要把body的className屬性改掉后，所有的級聯子節點都會相應地改變樣式，不像swing中需要一堆repaint() -,-
4. 要通過js修改網頁的某處文字，一開始我通過修改someNode.firstChild.nodeValue，后來發現有textContent和innerHTML屬性。不過貌似前者在IE中會出現問題，而后者IE和Firefox下表現也不完全一樣，需要小改動。
4. js中可以很方便的動態創建網頁標簽，好像是createElement(elementType)方法（Project2的代碼手頭沒有，只能憑記憶了），然后設置下newNode的屬性，再通過父節點的addChild方法加入就行了。注意newNode的parentNode是只讀的。
5. js訪問cookie也不難，從一本電子書上復制粘貼了getCookie和setCookie兩個方法，可以很方便地對cookie進行操作。
EyesOnMe.txt
完成模塊：
1. 用戶登錄與注銷
1) FF下需允許JavaScript修改狀態欄
2) FF下還有個小bug，舉例說明：
輸入test@aaa.com，登錄成功
修改文本框中的字符，比如修改成test@aa.com，再次登錄，提示登錄失敗，此時根據要求文本框內容清空
再次輸入test@aa.com，登錄成功
有點詭異，不過要防止這個bug只要在登錄后把onsubmit功能取消掉就行了。IE6下沒有這個問題。
2. 用戶注冊
3. 界面模塊
4. 選做1：實現組件在頁面內的自由拖放
5. 飛行游戲模塊 及 選做2
“增加星星”功能可以在運行時動態生成星星。
1) 在實現多個星星的控制的時候我使用了一個spacestar數組，發現訪問該數組成員時，不能使用for each循環
如果使用
for (star in spacestar) {...}
這樣star只會是一個字符串，并不是指向各元素的句柄。
但是使用
for (i = 0; i<spacestar.length; i++) {...}
然后通過spacestar[i]來訪問，可以得到各元素的句柄。
2) 新創建的星星div會自動排在原來div的后面，因此在設置top屬性的時候作了相關修正：
starY = Math.round(Math.random() * 130) - i * 30;
不過好像星星一多還是會有越界的現象發生，IE6下更為嚴重。
3) 一開始發現IE6不支持飛行游戲模塊，以為是IE6不支持createElement方法，后來才發現原來是某兩個語句后面少打了分號，FF自動修復
了，IE6沒修復，就無法執行了，如果瀏覽器腳本語言支持Python就好了 =_
6. 必做組件：便箋簿
覺得做為桌面Widget還是便箋比較有用，使用了cookie保存便箋內容，并支持動態生成、創建便箋的功能。
自認這個組件創意不咋的，不過技術含量還是挺高的 ^_^
7. 代碼風格
思考：
1. 我覺得跨瀏覽器關鍵靠經驗，剛開始學得每寫一點代碼就在不同瀏覽器中調試下，某些功能針對不同的瀏覽器使用不同的js方法。
1) 在便箋簿模塊中，生成新的<a>便簽的時候，鏈接文字使用
oNoteSetter.contentText = " 讀取";
在FF下正常，在IE6下無效；后來google了下，改用
oNoteSetter.innerHTML=" 讀取";
后FF和IE6下均通過。
2. 做這個project之前，我也不知道JavaScript居然有那么強大的功能，翻了Professional JavaScript for Web Developers和Making Use of
Javascript才知道原來可以動態生成元素、修改cookie。CSS的級聯特性也很不錯，要是用Java的Swing組件估計要痛苦地repaint()了。