茫茫網海中的冷日
         
茫茫網海中的冷日
發生過的事,不可能遺忘,只是想不起來而已!
 恭喜您是本站第 1671170 位訪客!  登入  | 註冊
主選單

Google 自訂搜尋

Goole 廣告

隨機相片
IMG_00089.jpg

授權條款

使用者登入
使用者名稱:

密碼:


忘了密碼?

現在就註冊!

站長日誌 - [苦水]不知道該怎麼形容的笨IE8!
 訂閱 冷日 的日誌

2010-04-08
[苦水]不知道該怎麼形容的笨IE8!

作者: 冷日 (10:23)

在以前,我們這些『網頁程式設計師』對於如何Debug都很頭痛!
除了各瀏覽器間的相容性以外,特別是 JavaScript 這個惱人的前端處理,更是讓許多工程師葬送數以萬計的腦細胞 不行了
也導致有許多相關的技術與東西來協助,比方說2006的時候,有人寫了這一篇:Javascript Debugger(IE & Firefox)備忘記
其中比較可愛的是Http Watch這東西,其他的部份,因為時代不一樣了,我們就另外解釋!

首先,大多數的網頁設計工程師,大概都知道了我們社群出身的可愛小火狐有個好用外掛叫做FireBug
雖然FireBug真的很好用,但是FireBug本身既然有擴充延伸的附加功能,我們當然要好好利用!
這裡再推薦 4 個好用元件,就更完美了:
YSlow:提供各種網頁分析數據,可作為網頁載入效能優化與除錯的參考。
Firecookie:檢視並管理網頁所使用的cookie。
FirePHP:方便作為PHP除錯之用。
Pixel Perfect:讓使用者直接新增網頁元件在頁面上作排版模擬,同時獲得Markup coding所需的參資訊。
參考資料:4個 Firebug 的必備元件

而我們該死的IE,當然看到別人家的好物絕對不會輕易放過,所以IE自從IE8開始,也有個一個神奇的東西叫做『開發者工具』!
我們的資深.NET 技術顧問Says:在Internet Explorer 8中,最具亮點的幾個特色就是開發者工具、三大新功能(Web Slice、Accelerator、Search Provider)兩個,其中三大新功能的部份,在Microsoft網站及許多Blog都已著墨許多,因此本文就不談這個,未來在此系列文章內,預計將由實際案例應用來介紹她們。
大家可以參閱這裡:[IE8] Internet Explorer 8 中的JavaScript - 黃忠成- 點部落(因為她希望用Link低,不給全文轉載,所以請大家自己移駕)!
而且微軟的這個開發者工具也是有開放下載的喔:Internet Explorer Developer Toolbar,只是不知道和IE6或是IE7的相容性就是了 XD
反正,該學得都學了、該偷的也沒放過,至少M$這次有小小地關心到我們這些可憐的工程師了! 苦惱煙狂

OK,看起來,IE上道很多嘛!?冷日怎麼又下了這麼一個怨念的標題呢?又為啥一副想殺人的樣子呢?
故事要從一行程式碼說起:冷日因為某專案,有一個需要前端計算總額的功能,所以用JavaScript做了一個迴圈計算,在計算前當然得先檢查一下資料ㄌㄡ,所以有了下面這行code!

if( document.forms[0].elements[count].value != "" && eval(document.forms[0].elements[count].value) > 0 ) {
本來以為都很正常一切無事的交差了,沒想到竟被反應『如果欄位裡面給空白的話,計算會錯誤,顯示「Undifine」耶!』,冷日當下一頭霧水 疑惑
冷日一測,真的會這樣耶!?不光空白會怪,只填一個零也怪!
追查程式碼半天,看起來都OKㄚ!?冷日當年測試也都很OKㄚ!?到底問題在哪呢?心一橫,來這樣測測看好了:
if( document.forms[0].elements[count].value != "" ) {
  if( eval(document.forms[0].elements[count].value.replace(/(^0*)/g, "")) > 0  ) {
我的天 失魂 居然真的這樣就過了! 石化
這怎麼讓冷日可以接受呢!?越想越怪,那之前測試的時候怎麼沒發現呢!?
突然想到,ㄚ~之前都是拿FireBug在追蹤與測試,難道FireFox沒事!?
程式改回一行的 if 判斷式,透過 && 來做檢查,經證明在 FireFox 和 Google Chrome 都很正常,一切無誤!
唯獨在 IE 裡面,就是不能這樣寫!一定要分成兩個 IF 判斷式她才會對! 烏鴉飛過

不要說我污賴IE,我們來看看人家對於 JavaScript 的說明:
如果&&的第一個運算數是false,就不再考慮第二個運算數,直接返回false;如果||的第一個運算數是true,也不再考慮第二個運算數,直接返回true。&和|運算符卻不是這樣的,它們總是要比較兩個運算數才得出結果,因而性能上&&和||會比&和|好。
由於&&和||可能不考慮第二個運算數,所以我們應盡量避免在它們右邊使用具有副作用(賦值、遞增、遞減和函數調用)的表達式,除非非常清楚自己再做什麼。
資料來源:JavaScript && & || | 运算符 - 牛C网
也就是說, JavaScript 本身是支援 && 和 || 運算低,只是我們該死的 IE 又自己耍寶了! 翻桌
偏偏我還必須為了她,把自己的程式改成這樣得醜醜兩層 IF 寫法!不寫篇文罵罵死 IE 實在難消不爽ㄚ 怒火中燒
難怪 IE 的效能永遠這麼慢,誰來幫幫忙把 IE 的核心團隊拖出去砍了ㄚ!? 打小人

唯一的收穫,大概就是知道 IE8 也有個『開發者工具』了吧!?以後來測測玩玩,若有心得將另行報告!

閱讀 冷日 的日誌 | 迴響 (0) | 引用次數 (0) | 瀏覽次數 (1982)
列印這一篇日誌  發送這篇日誌給你的朋友(Email) 
 

 
 

 
 

 
 
 
這些評論各由發表者自負責任. 對於他們的發言內容, 本站不提供任何擔保.
張貼者 討論串

Powered by XOOPS 2.0 © 2001-2008 The XOOPS Project|