首頁 web前端 js教程 推薦閱讀的js快速判斷IE瀏覽器(相容IE10與IE11)_javascript技巧

推薦閱讀的js快速判斷IE瀏覽器(相容IE10與IE11)_javascript技巧

May 16, 2016 pm 03:26 PM
ie瀏覽器 js 判斷

判斷是否IE瀏覽器用的是window.navigator.userAgent,追蹤這個訊息,發現在開發環境,識別為IE10,但訪問伺服器則識別為IE11,但IE11的userAgent裡是沒有MSIE標誌的,原因就是這個了。


把判斷IE瀏覽器的方法改成如下就可以了。

function isIE() { //ie?
 if (!!window.ActiveXObject || "ActiveXObject" in window)
 return true;
 else
 return false;
 }
登入後複製

以下是一些分享,大家可以看下,很實用的分析解說

很多時候,我們一般會採用navigator.userAgent和正規表示來判斷IE瀏覽器版本,以下介紹用IE瀏覽器中不同特性來判斷IE瀏覽器

1 判斷IE瀏覽器與非IE 瀏覽器

IE瀏覽器與非IE瀏覽器的差異是IE瀏覽器支援ActiveXObject,但是非IE瀏覽器不支援ActiveXObject。在IE11瀏覽器還沒出現的時候我們判斷IE和非IE常常是這麼寫的

function isIe(){
 return window.ActiveXObject ? true : false;
 }
登入後複製

但是在IE11中上面判斷的回傳的是false,我自己在IE11測試了下如下程式碼

複製程式碼 程式碼如下:

alert(window.ActiveXObject);
alert(typeof window.ActiveXObject);

結果是

這是為什麼呢?明明ActiveXObject是存在的,怎麼就typeof的結果確實undefined。哪位知道結果的告訴我這是為什麼呢?為神馬?

微軟上的官網說出了IE11的ActiveXObject的不同。 http://msdn.microsoft.com/en-us/library/ie/dn423948%28v=vs.85%29.aspx。但是並沒有解釋typeof的原因。如果我們用下面的程式碼來偵測是可以的

alert("ActiveXObject" in window)//在ie11下回傳的是false

這是我又不懂了"ActiveXObject" in window回傳的是true,為什麼以前判斷IE瀏覽器的程式碼在IE11中回傳的是false?再求大牛們給個解釋。謝謝
下面就直接給出相容IE11判斷IE與非IE瀏覽器的方法。

function isIe(){
 return ("ActiveXObject" in window);
 }
登入後複製

注意前提條件是我們的程式碼中不要覆蓋ActiveXObject,應該沒有哪個程式這麼做吧。呵呵。

2 判斷IE6瀏覽器

從IE7開始IE是支援XMLHttpRequest物件的,唯獨IE6是不支援的。根據這個特性和前面判斷IE的函數isIe()我們就知道怎麼判斷IE6了吧。判斷方法如下

function isIe6() {
 // ie6是不支持window.XMLHttpRequest的
 return isIe() && !window.XMLHttpRequest;
 }
登入後複製

3 判斷IE7瀏覽器

因為從IE8開始是支援文件模式的,它支援document.documentMode。 IE7是不支援的,但是IE7是支援XMLHttpRequest物件的。判斷方法如下

function isIe7() {
 //只有IE8+才支持document.documentMode
 return isIe() && window.XMLHttpRequest && !document.documentMode;
 }
登入後複製

4 判斷IE8瀏覽器

在從IE9開始,微軟慢慢的靠近標準,我們把IE678稱為非標準瀏覽器,IE9+與其他如chrome,firefox瀏覽器稱為標準瀏覽器。兩者的差別其中有一個是。大家測試下如下程式碼。回傳的是什麼

alert(-[1,]);//在IE678中打印的是NaN,但是在標準瀏覽器打印的是-1

那我們就可以根據上面的差異來判斷是IE8瀏覽器。方法如下

function isIe8(){
 // alert(!-[1,])//->IE678返回NaN 所以!NaN为true 标准浏览器返回-1 所以!-1为false
 return isIe() &&!-[1,]&&document.documentMode;
}
登入後複製

5 判斷IE9、IE10、IE11瀏覽器

從IE8瀏覽器是支援JSON內建物件的,從IE10開始支援js的嚴格模式,關於JS中的嚴格模式請參考這篇文章http://www.jb51.net/article/75037 .htm

IE9+下alert(!-[1,])回傳的是false,IE9+是支援addEventListener的,但是IE11瀏覽器中是不支援原來IE中獨有的事件綁定attachEvent。根據這些差異我們就能分辨出IE9、IE10、IE11瀏覽器了。

6 判斷其他瀏覽器

/****来自曾经项目中封装的公共类函数***/
//检测函数
var check = function(r) {
 return r.test(navigator.userAgent.toLowerCase());
 };
var statics = {
 /**
 * 是否为webkit内核的浏览器
 */
 isWebkit : function() {
 return check(/webkit/);
 },
 /**
 * 是否为火狐浏览器
 */
 isFirefox : function() {
 return check(/firefox/);
 },
 /**
 * 是否为谷歌浏览器
 */
 isChrome : function() {
 return !statics.isOpera() && check(/chrome/);
 },
 /**
 * 是否为Opera浏览器
 */
 isOpera : function() {
 return check(/opr/);
 },
 /**
 * 检测是否为Safari浏览器
 */
 isSafari : function() {
 // google chrome浏览器中也包含了safari
 return !statics.isChrome() && !statics.isOpera() && check(/safari/);
 }
};
登入後複製

js如何判斷IE瀏覽器的版本包含IE11

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title>脚本之家</title>
<script type="text/javascript">
var userAgent = navigator.userAgent, 
rMsie = /(msie\s|trident.*rv:)([\w.]+)/, 
rFirefox = /(firefox)\/([\w.]+)/, 
rOpera = /(opera).+version\/([\w.]+)/, 
rChrome = /(chrome)\/([\w.]+)/, 
rSafari = /version\/([\w.]+).*(safari)/; 
var browser; 
var version; 
var ua = userAgent.toLowerCase(); 
function uaMatch(ua){ 
 var match = rMsie.exec(ua); 
 if(match != null){ 
 return { browser : "IE", version : match[2] || "0" }; 
 } 
 var match = rFirefox.exec(ua); 
 if (match != null) { 
 return { browser : match[1] || "", version : match[2] || "0" }; 
 } 
 var match = rOpera.exec(ua); 
 if (match != null) { 
 return { browser : match[1] || "", version : match[2] || "0" }; 
 } 
 var match = rChrome.exec(ua); 
 if (match != null) { 
 return { browser : match[1] || "", version : match[2] || "0" }; 
 } 
 var match = rSafari.exec(ua); 
 if (match != null) { 
 return { browser : match[2] || "", version : match[1] || "0" }; 
 } 
 if (match != null) { 
 return { browser : "", version : "0" }; 
 } 
} 
var browserMatch = uaMatch(userAgent.toLowerCase()); 
if (browserMatch.browser){ 
 browser = browserMatch.browser; 
 version = browserMatch.version; 
} 
document.write(browser+version);  
</script>
</script>
</head>
<body>
 
</body>
</html>
登入後複製

上面的程式碼實現了判斷功能,以下介紹一下它的實作原理,希望能夠為需要的朋友帶來幫助。

先來看一段程式碼:

navigator.userAgent

IE11下的資訊截圖:

然後使用對應的正規表示式進行比對。 IE11和以前版本的瀏覽器還是有較大差別的,以前的版本,這個信息中包含msie,IE11中沒有了,新增加trident,後面跟著瀏覽器的版本號碼,這一點要特別注意一下。

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1662
14
CakePHP 教程
1418
52
Laravel 教程
1311
25
PHP教程
1261
29
C# 教程
1234
24
網頁圖片載入不出來怎麼辦? 6種解決辦法 網頁圖片載入不出來怎麼辦? 6種解決辦法 Mar 15, 2024 am 10:30 AM

  有網友發現打開瀏覽器網頁,網頁上的圖片遲遲加載不出來,是怎麼回事?檢查過網路是正常的,那是哪裡出現了問題呢?下面小編就來跟大家介紹一下網頁圖片載入不出來的六種解決方法。網頁圖片載入不出來:  1、網速問題網頁顯示不出圖片有可能是因為電腦的網路速度比較慢,電腦中開啟的軟體比較多,  而我們造訪的圖片比較大,這就可能因為載入逾時,導致圖片顯示不出來,  可以將比較佔網速的軟體將關掉,可以去任務管理器查看一下。  2、造訪人數過多  網頁顯示不出圖片還有可能是因為我們造訪的網頁,在同時段造訪的

建議:優秀JS開源人臉偵測辨識項目 建議:優秀JS開源人臉偵測辨識項目 Apr 03, 2024 am 11:55 AM

人臉偵測辨識技術已經是一個比較成熟且應用廣泛的技術。而目前最廣泛的網路應用語言非JS莫屬,在Web前端實現人臉偵測辨識相比後端的人臉辨識有優勢也有弱勢。優點包括減少網路互動、即時識別,大大縮短了使用者等待時間,提高了使用者體驗;弱勢是:受到模型大小限制,其中準確率也有限。如何在web端使用js實現人臉偵測呢?為了實現Web端人臉識別,需要熟悉相關的程式語言和技術,如JavaScript、HTML、CSS、WebRTC等。同時也需要掌握相關的電腦視覺和人工智慧技術。值得注意的是,由於Web端的計

360極速瀏覽器相容模式怎麼設定 360極速瀏覽器相容模式怎麼設定 Feb 24, 2024 am 10:49 AM

360極速瀏覽器是一款備受歡迎的瀏覽器應用,使用者可以透過它快速、安全地存取網路。為了解決頁面顯示異常或功能無法正常使用這個問題,360極速瀏覽器提供了相容模式功能,讓使用者能夠更好地瀏覽網頁。那麼360極速瀏覽器相容模式怎麼設定呢?不用急,接下來小編為大家帶來了360極速瀏覽器相容模式設定教程,希望能夠幫助大家。 360極速瀏覽器相容模式怎麼設定1、開啟在本站下載的360極速瀏覽器,開啟軟體後點選右上角的三個橫槓圖示。 2、在彈出的選項中點選【設定】。 3.在開啟的360極速瀏覽器設定視窗中點擊

win11可信任網站怎麼設定_windows11中IE新增信任網站的方法 win11可信任網站怎麼設定_windows11中IE新增信任網站的方法 May 08, 2024 pm 01:11 PM

1、首先我們打開我們的系統中的ie瀏覽器,在右上角找到齒輪狀按鈕點擊它。 2.點開之後可以看到一個下拉選單,在其中找到並點選【相容性檢視設定】4、然後在新增此網站中輸入需要新增的網址,再點選右邊的【新增】就可以了。

雙核心瀏覽器是什麼瀏覽器 雙核心瀏覽器是什麼瀏覽器 Feb 20, 2024 am 08:22 AM

雙核心瀏覽器是一種整合了兩個不同瀏覽器核心的瀏覽器軟體。核心是瀏覽器的核心部分,負責渲染網頁內容和執行網頁腳本等功能。傳統瀏覽器一般只使用單一的內核,如IE瀏覽器使用Trident內核,Chrome瀏覽器使用WebKit/Blink內核,火狐瀏覽器使用Gecko內核等。而雙核心瀏覽器則將兩個不同核心整合在一個瀏覽器中,使用者可以根據需要自由切換使用。雙核瀏覽器的出

js和vue的關係 js和vue的關係 Mar 11, 2024 pm 05:21 PM

js和vue的關係:1、JS作為Web開發基石;2、Vue.js作為前端框架的崛起;3、JS與Vue的互補關係;4、JS與Vue的實踐應用。

edge瀏覽器如何關閉廣告? edge瀏覽器廣告關閉法介紹 edge瀏覽器如何關閉廣告? edge瀏覽器廣告關閉法介紹 Mar 14, 2024 pm 03:49 PM

edge瀏覽器現在Windows系統都安裝的瀏覽器工具,許多使用者在使用的時候,發現出現了許多的廣告彈窗,許多人都想要知道這些廣告要怎麼設定才能夠關閉,針對這個問題,今日軟體教學就來為廣大用戶們解答,接下來讓我們一直來看看詳細的操作步驟吧。  edge瀏覽器廣告關閉方法介紹:  1、進入軟體,點擊頁面頂部右側的三個點圖標,在下拉的選項選單中選擇「設定」。  2、在新介面中,點擊“高級”,然後找到“網站設定”下方的“使

Go語言中如何判斷日期是否為前一天? Go語言中如何判斷日期是否為前一天? Mar 24, 2024 am 10:09 AM

題目:Go語言中如何判斷日期是否為前一天?在日常開發中,常常會遇到需要判斷日期是否為前一天的情況。在Go語言中,我們可以透過時間運算來實現這個功能。以下將結合具體的程式碼範例來示範如何在Go語言中判斷日期是否為前一天。首先,我們需要導入Go語言中的時間包,程式碼如下:import(&quot;time&quot;)接著,我們定義一個函式IsYest

See all articles