IE瀏覽器不管是什麼版本,總是跟Web標準有些不太相容。對於程式碼工作者來說,自然是苦不堪言,為了考慮IE的兼容問題,不管是寫CSS 還是JS,往往都要對IE 特別對待,這就少不了做些判斷。本文不討論如何區分IE 的樣式,僅是JS 判定IE 瀏覽器。
這個目前世界上最短的Javascript 判定IE 瀏覽器的方法來自俄羅斯!它已經在各版本的IE 以及目前其他流行的瀏覽器上經過測試,基於IE 的Bug,微軟雖然已經意識到,但是從來沒有糾正過。
<script type='text/javascript'> var ie = !-[1,]; alert(ie); </script> |
以上程式碼運行結果:IE 下回傳true,其他標準瀏覽器回傳false。 !-[1,],只剩6 bytes!
不過如果反過來判斷,標準瀏覽器回傳true 而IE 回傳false的話,則可以再縮短一個byte。
<script type='text/javascript'> notIe = -[1,]; if(-[1,]){ // 標準瀏覽器程式碼 }else{ // IE Only的程式碼 } </script> |
看完了這些,你們是不是很好奇這些是怎麼運作的?請繼續看下文。
這個Bug 產生的原因是IE 會加一個空數組元素到數組元素的總數裡。
[1,]. Length標準瀏覽器會回傳1 (基於標準的ECMAscript ,在數組最後的逗號」,」會被忽略,這是為了方便在一列裡顯示以及自動生成等),但是IE 會回傳2。當你列印這個陣列的時候IE 將會回傳「1, “,也就是兩個元素,而其他標準瀏覽器將會回傳「1″。
這很容易驗證,例如在IE 和FF中運行以下程式碼:
<script type='text/javascript'> alert([,]==','); //這是8個字符判定IE </script> |
[1,]實際上瀏覽器的操作是toString()轉換成字串的操作,-[1,]是將字串強制轉換為數字。而IE 將會回傳NaN,但遺憾的是NaN 並不是一個數字,因為[1,]轉換成字串後的」1,」裡面有逗號。而其他標準瀏覽器會回傳-1,這是一個非0 的數字。
你知道,NaN 轉換成Boolean 型將會回傳false,所以-[1,]在IE 下將會回傳false。而任何非0 的數字轉換成Boolean 型(例如-1),在標準瀏覽器下都會傳回true。所以我們得到了一個判定結果,!-[1,]在IE 下回傳true,而在其他標準瀏覽器下回傳false。也達到了區分判定IE 瀏覽器的目的。
當然,如前文所說,這個Bug 其實微軟很早就已經知道,但是卻一直沒有去修復它,所以在未來的> IE8 的IE 瀏覽器也就不確定是否依舊可以,不過基本上這麼多代的IE 都沒有修復,未來的IE 也不太會修復的樣子。
以下是其他的一些區分判定IE 瀏覽器的程式碼,也可以參考下:
<script type='text/javascript'> // Option from Dean Edwards: var ie = /*@cc_on!@*/false; // Use the commented line: var ie//@cc_on=1; // Variation (shorter variable): var ie = 'v'=='v'; / / Option to Gareth Hayes (former record-holder): var ie = !+"v1"; </ script> |