做網站，js檢測使用者瀏覽器的版本，是經常要使用到，今天自己寫了一個js，完成了對於一些常見瀏覽器的檢測，但是，偏偏對於360瀏覽器的檢測沒有任何辦法，研究了一會兒，無果。無論是360安全瀏覽器，還是360極速瀏覽器，在極速模式下面，都只能檢測到使用者是使用的谷歌瀏覽器。後來在網上找了很久，看了很多大神的帖子，結合了自己的想法，寫出了下面的解決辦法：
這是 BrowserCheck.html頁面顯示檔案：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>瀏覽器檢測</title> </head> <script> window. browserCheck(); } </script> <script src="jquery.min.js"></script> <script src="latest.js"></script> <script src="check.js"></script> <body> </body> </html>
這是Check.js顯示檔案，用來列印使用者瀏覽器的版本號：
function browserCheck(){
var userAgent = navigator.userAgent,
rMsie = /(msies|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[1] || "", version : match[2] || "0" };
}
if (match != null) {
return { browser : "", version : "0" };
}
}
var browserMatch = uaMatch(userAgent.toLowerCase());
if (browserMatch.browser) {
browser = browserMatch.browser;
version = browserMatch.version;
}
var i=0;
var s = $.ua().is360se;
if(s==true){
document.write("使用者瀏覽器版本檢測——by Mona_俠快：你正在使用360安全瀏覽器Chrome核心,核心版本號："+version);
i=1;
}
var s = $.ua().is360ee;
if(s==true){
document.write("使用者瀏覽器版本檢測——by Mona_俠快：你正在使用360極速瀏覽器Chrome核心,核心版本號："+version);
i=1;
}
var s = $.ua().isChrome;
if(s==true){
document.write("使用者瀏覽器版本檢測——by Mona_俠快：你正在使用谷歌瀏覽器（原版）,核心版本號："+version);
i=1;
}
var s = $.ua().isLiebao;
if(s==true){
document.write("使用者瀏覽器版本檢測——by Mona_俠快：你正在使用獵豹瀏覽器chrome核心,核心版本號："+version);
i=1;
}
var s = $.ua().isLiebao;
if(s==true){
document.write("使用者瀏覽器版本檢測——by Mona_俠快：你正在使用獵豹瀏覽器chrome核心,核心版本號："+version);
i=1;
}
var s = $.ua().isSougou;
if(s==true){
document.write("使用者瀏覽器版本檢測——by Mona_俠快：你正在使用搜狗瀏覽器chrome核心,核心版本號："+version);
i=1;
}
var s1 = $.ua().isIe;
if(s1==true){
var s2 = $.ua().ie;
document.write("使用者瀏覽器版本檢測——by Mona_俠快：你正在使用IE瀏覽器，核心版本號："+version);
if(s2<8){
alert("使用者瀏覽器版本檢測——by Mona_俠快：您使用的瀏覽器在IE8.0以下，為了您獲得良好的上網體驗，強烈建議您升級您的IE，或者使用360安全瀏覽器！");
}
i=1;
}
var s = $.ua().isFirefox;;
if(s==true){
document.write("使用者瀏覽器版本檢測——by Mona_俠快：你正在使用firefox瀏覽器，核心版本號："+version);
i=1;
}
var s = $.ua().isMobile;
if(s==true){
document.write("使用者瀏覽器版本檢測——by Mona_俠快：你正在使用手機版瀏覽器");
i=1;
}
var s = $.ua().isTablet;
if(s==true){
document.write("使用者瀏覽器版本檢測——by Mona_俠快：你正在使用平板瀏覽器");
i=1;
}
if(i==0){
document.write("使用者瀏覽器版本檢測——by Mona_俠快：你正在使用的是"+browser+"瀏覽器"+"核心版本號："+version);
}
}
// JavaScript Document
其中有一個jquery外掛jquery.min.js，請到附件中下載^_^!
附件中包含了這幾個檔案。
這個latest.js是用來檢測瀏覽器版本的：
/**
* 1. 獲取ua字串
* $.ua().ua;
*
* 2. 設定ua字串
* $.ua("string");
*
* 3. 獲取引數
* $.ua().platform;
* $.ua().browser;
* $.ua().engine;
*
* 4. 核心判斷
* $.ua().isWebkit;
* $.ua().isGecko;
* $.ua().isTrident;
*
* 4. 外殼判斷
* $.ua().isChrome;
* $.ua().isFirefox;
* $.ua().is360se;
* $.ua().is360ee;
* $.ua().isLiebao;
* $.ua().isSougou;
* $.ua().ie;
* $.ua().isIe;
* $.ua().isIe6;
* $.ua().isIe7;
* $.ua().isIe8;
* $.ua().isIe9;
* $.ua().isIe10;
* $.ua().isIe11;
*/
;
(function ($, win, undefined) {
var UA = win.navigator.userAgent,
doc = win.document,
parseRule = {
platforms: [
// windows phone
{
name: `windows phone`,
versionSearch: `windows phone os `,
versionNames: [ // windows phone must be tested before win
{
number: `7.5`,
name: `mango`
}
]
},
// windows
{
name: `win`,
slugName: `windows`,
versionSearch: `windows(?: nt)? `,
versionNames: [{
number: `6.2`,
name: `windows 8`
}, {
number: `6.1`,
name: `windows 7`
}, {
number: `6.0`,
name: `windows vista`
}, {
number: `5.2`,
name: `windows xp`
}, {
number: `5.1`,
name: `windows xp`
}, {
number: `5.0`,
name: `windows 2000`
}]
},
// ipad
{
name: `ipad`,
versionSearch: `cpu os `,
flags: [`ios`]
},
// ipad and ipod must be tested before iphone
{
name: `ipod`,
versionSearch: `iphone os `,
flags: [`ios`]
},
// iphone
{
name: `iphone`,
versionSearch: `iphone os `,
flags: [`ios`]
},
// iphone must be tested before mac
{
name: `mac`,
versionSearch: `os x `,
versionNames: [{
number: `10.8`,
name: `mountainlion`
}, {
number: `10.7`,
name: `lion`
}, {
number: `10.6`,
name: `snowleopard`
}, {
number: `10.5`,
name: `leopard`
}, {
number: `10.4`,
name: `tiger`
}, {
number: `10.3`,
name: `panther`
}, {
number: `10.2`,
name: `jaguar`
}, {
number: `10.1`,
name: `puma`
}, {
number: `10.0`,
name: `cheetah`
}]
},
// android
{
name: `android`,
versionSearch: `android `,
versionNames: [
// android must be tested before linux
{
number: `4.1`,
name: `jellybean`
}, {
number: `4.0`,
name: `icecream sandwich`
}, {
number: `3.`,
name: `honey comb`
}, {
number: `2.3`,
name: `ginger bread`
}, {
number: `2.2`,
name: `froyo`
}, {
number: `2.`,
name: `eclair`
}, {
number: `1.6`,
name: `donut`
}, {
number: `1.5`,
name: `cupcake`
}
]
},
// blackberry
{
name: `blackberry`,
versionSearch: `(?:blackberry\d{4}[a-z]?|version)/`
},
// blackberry
{
name: `bb`,
slugName: `blackberry`,
versionSearch: `(?:version)/`
},
// blackberry
{
name: `playbook`,
slugName: `blackberry`,
versionSearch: `(?:version)/`
},
// linux
{
name: `linux`
},
// nokia
{
name: `nokia`
}
],
browsers: [{
name: `iemobile`,
versionSearch: `iemobile/`
}, // iemobile must be tested before msie
{
name: `msie`,
slugName: `ie`,
versionSearch: `msie `
}, {
name: `firefox`,
versionSearch: `firefox/`
}, {
name: `chrome`,
versionSearch: `chrome/`
}, // chrome must be tested before safari
{
name: `safari`,
versionSearch: `(?:browser|version)/`
}, {
name: `opera`,
versionSearch: `version/`
}
],
engines: [{
name: `trident`,
versionSearch: `trident/`
}, {
name: `webkit`,
versionSearch: `webkit/`
}, // webkit must be tested before gecko
{
name: `gecko`,
versionSearch: `rv:`
}, {
name: `presto`,
versionSearch: `presto/`
}
]
},
// [10,)版本就無法判斷
ieVer = (function () {
var v = 3,
p = doc.createElement(`p`),
all = p.getElementsByTagName(`i`);
while (
p.innerHTML = `<!--[if gt IE ` + (++v) + `]><i></i><![endif]-->`,
all[0]);
return v > 4 ? v : 0;
}()),
ieAX = win.ActiveXObject,
ieMode = doc.documentMode,
isIe = ieAX || ieMode,
isIe6 = (ieAX && ieVer == 6) || (ieMode == 6),
isIe7 = (ieAX && ieVer == 7) || (ieMode == 7),
isIe8 = (ieAX && ieVer == 8) || (ieMode == 8),
isIe9 = (ieAX && ieVer == 9) || (ieMode == 9),
isIe10 = ieMode === 10,
isIe11 = ieMode === 11,
isChrome = !isIe && _mime("type", "application/vnd.chromium.remoting-viewer"),
isLiebao = !isIe && !! win.external && !! win.external.LiebaoAutoFill_CopyToClipboard,
is360ee = !isIe && !isChrome && !isLiebao && _plugins("filename", "pepflashplayer.dll"),
is360se = !isIe && !is360ee && _mime("suffixes", "dll", "description", /fancy/),
isSougou = !isIe && _plugins("filename", "NPComBrg310.dll"),
isFirefox = win.scrollMaxX !== undefined;
if (isIe6) {
ieVer = 6;
} else if (isIe7) {
ieVer = 7;
} else if (isIe8) {
ieVer = 8;
} else if (isIe9) {
ieVer = 9;
} else if (isIe10) {
ieVer = 10;
} else if (isIe11) {
ieVer = 11;
}
$.extend({
ua: function () {
var args = arguments,
argL = args.length,
ua = (argL == 1 && $.type(args[0]) == "string" ? args[0] : UA).toLowerCase(),
objPlatform = _parse(parseRule.platforms, ua),
objBrowser = _parse(parseRule.browsers, ua, true),
objEngine = _parse(parseRule.engines, ua);
return {
// 返回ua字串
ua: ua,
// 操作平臺
platform: $.extend({}, objPlatform, {
os: win.navigator.platform.toLowerCase(),
plugins: win.navigator.plugins
}),
// 瀏覽器核心
engine: objEngine,
// 瀏覽器外殼
browser: objBrowser,
// ie
isIe: !! ieVer,
isIe6: isIe6,
isIe7: isIe7,
isIe8: isIe8,
isIe9: isIe9,
isIe10: isIe10,
isIe11: isIe11,
ie: ieVer,
// 核心
isWebkit: !! objEngine.isWebkit,
isGecko: !! objEngine.isGecko,
isTrident: !! objEngine.isTrident,
// 外殼[優先特徵判斷]
isChrome: isChrome,
is360ee: is360ee,
is360se: is360se,
isSougou: isSougou,
isLiebao: isLiebao,
isFirefox: isFirefox,
// 型別
isMobile: objPlatform.isMobile,
isTablet: objPlatform.isTablet,
isDesktop: objPlatform.isDesktop
};
}
});
/**
* 解析
* 參考：https://github.com/terkel/jquery-ua
* @param {Array} 需要解析的資料
* @param {String} 需要解析的ua字串
* @param {Boolean} 是否為解析瀏覽器資料
* @return {Object} 解析後的物件
* @version 1.0
* 2013年9月27日13:36:47
*/
function _parse(rule, ua, isBrowser) {
var item = {},
name,
versionSearch,
flags,
versionNames,
i,
is,
ic,
j,
js,
jc;
if (isBrowser && ieVer) {
return {
name: "ie",
ie: true,
version: ieVer,
isIe: true
}
}
for (i = 0, is = rule.length; i < is; i++) {
ic = rule[i];
name = ic.name;
versionSearch = ic.versionSearch;
flags = ic.flags;
versionNames = ic.versionNames;
if (ua.indexOf(name) !== -1) {
item.name = name.replace(/s/g, ``);
if (ic.slugName) {
item.name = ic.slugName;
}
item["is" + _upperCase1st(item.name)] = true;
item.version = (`` + (new RegExp(versionSearch + `(\d+((\.|_)\d+)*)`).exec(ua) || [, 0])[1]).replace(/_/g, `.`);
if (flags) {
for (j = 0, js = flags.length; j < js; j++) {
item["is" + _upperCase1st(flags[j])] = true;
}
}
if (versionNames) {
for (j = 0, js = versionNames.length; j < js; j++) {
jc = versionNames[j];
if (item.version.indexOf(jc.number) === 0) {
item.fullname = jc.name;
item["is" + _upperCase1st(item.fullname)] = true;
break;
}
}
}
if (rule === parseRule.platforms) {
item.isMobile = /mobile|phone/.test(ua) || item.isBlackberry;
item.isMobile = item.isMobile === undefined ? false : true;
item.isTablet = /tablet/.test(ua) || item.isIpad || (item.isAndroid && !/mobile/.test(ua));
item.isTablet = item.isTablet === undefined ? false : true;
if (item.isTablet) item.isMobile = false;
item.isDesktop = !item.isMobile && !item.isTablet ? true : false;
if (item.ios) {
item.fullname = `ios` + parseInt(item.version, 10);
item["is" + _upperCase1st(item.fullname)] = true;
}
}
break;
}
}
if (!item.name) {
item[`isUnknown`] = true;
item.name = ``;
item.version = ``;
}
return item;
}
// 大寫第一個字母
function _upperCase1st(string) {
return string.replace(/^(w)/, function (w) {
return w.toUpperCase()
});
}
// 測試mime
function _mime(where, value, name, nameReg) {
var mimeTypes = win.navigator.mimeTypes,
i;
for (i in mimeTypes) {
if (mimeTypes[i][where] == value) {
if (name !== undefined && nameReg.test(mimeTypes[i][name])) return true;
else if (name === undefined) return true;
}
}
return false;
}
// 測試plugins
function _plugins(where, value) {
var plugins = win.navigator.plugins,
i;
for (i in plugins) {
if (plugins[i][where] == value) return true;
}
return false;
}
})(jQuery, this);
本人是個新手，不足之處大家一起探討