有關IE版本檢測

2012-01-01

0

PS：檢測瀏覽器雖然不是一個什么好的做法，但是有時候還是很必要的。

見得最多的就是檢測navigator.userAgent(這個可以面向所有瀏覽器，略過)。

另外一種就是IE的條件注釋，這篇有個比較詳細的說明

http://www.cnblogs.com/JustinYoung/archive/2009/03/02/ie-jiaojianzhushi.html，注意看它下面的回復

var ieVersion = (function(){ return document.getElementById('ieVersion')})();

以此類推，可以獲得各個版本的信息，甚至可以添加gt，gte等，從而一次判定一類版本。

關于這種寫法，有個例子就是：

于是在CSS里面就可以不用別的hack了,從而避免在IE里面多加載一次CSS，

直接.ie6 xx{}.ie7 xx{}.ie8 xx{}xx{}

第二、既然可以寫在頁面內，當然也可以JS來動態生成。我google了一把，發現還真有人這么做的。

文章地址如下：http://www.cnblogs.com/bruceli/archive/2011/04/11/2012470.html，寫得還比較詳細，原理也很簡單。

不過這樣的缺憾就是把條件注釋限定到JS上了，于CSS就是雞肋了。

繼續，既然可以動態生成條件注釋來辨明IE版本，基于IE的CSS hack，應該也可以動態生成一段html片段，用樣式值來判定版本。

下面是最容易想到的形式，我測試發現這么確實可以，不過也發現了一個問題，看下面的一段代碼：

測試

var test_1 = document.getElementById('test_1');

var test_2 = document.createElement('div');

test_2.innerHTML = '測試';

console.log('test_1:' + test_1.firstChild.style.color + '----' + 'test_2:' + test_2.firstChild.style.color);

在IE9下結果：LOG: test_1:yellow----test_2:yellow

在IE8下結果：LOG: test_1:#ff6600----test_2:#ff6600

在IE7下結果：LOG: test_1:green----test_2:blue

在IE6下結果：test_1:blue?----test_2:blue (IE6沒有console.log，所以上面的console.log需要換成alert)

上面的問題大家應該看出來了，IE7下兩種情況不一致，不知道是我的IE7兼容模式的問題還是別的什么原因，知道的請指教。

確認代碼：

原始

var test = document.createElement('div');

test.innerHTML = '動態生成';

document.body.appendChild(test);

IE7結果：

IE6結果：

基本原理和IE的條件注釋差不多，我們一次檢測color值就可以了，所以改變一下上面的例子就是：

測試

var test_1 = document.getElementById('test_1');

//var test_2 = document.createElement('div');

//test_2.innerHTML = '測試';

var c = test_1.firstChild.style.color;

alert(c=='red'?'other':c=='yellow'?'IE9':c=='#ff6600'?'IE8':c=='green'?'IE7':'IE6');

在IE9下結果：IE9

在IE8下結果：IE8

在IE7下結果：IE7

在IE6下結果：IE6

按理來說，對于FF,Chrome/Safari、opera都可以利用-moz、-webkit、-o等私有前綴來辨別，不過對于屬性的選取要斟酌，類似color是不行的。

這個檢測方法旁門左道而已，未來版本或者其他瀏覽器是不是有這個bug也不確定，而且IE7的那個bug我還沒有弄清楚，所以也就暫時知道可以這么做就可以了。

轉載請注明來自小西山子【http://www.cnblogs.com/xesam/】

本文地址：http://www.cnblogs.com/xesam/archive/2012/01/01/2309483.html

0

*特別聲明：以上內容來自于網絡收集，著作權屬原作者所有，如有侵權，請聯系我們：admin@shaoqun.com。

總結

以上是生活随笔為你收集整理的java 检测ie版本更新_[Java教程]有关IE版本检测_星空网的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。